Git Product home page Git Product logo

studyorder's Introduction

CURRENT

LINKS TO GUIDES

MISC

  • webpack/gulp

Projects

Project #7: Book club (react native)

Project #19: DJ Spotify (maybe it recomends public play lists? if possible) https://medium.freecodecamp.org/every-time-you-build-a-to-do-list-app-a-puppy-dies-505b54637a5d

Clone Spotify - you can sign up for a free account. Spotify

You can use their API to search pretty much all of the data they have available: Spotify Web API

real time chat app (socket.io maybe?) maybe with a bot maybe into a game incorperating the bot

You can't actually pull full length versions of the media to play in your app, just play the demo track ;)

  • PUBLISH NPM MODULE

  • RE_FACTOR TIC TAC TOE GAME WITH SMART AI USE MIN MAX ALGO

  • [ ]CHROME EXTENSION Vigenere / Caesar Ciphers

  • [ ]Web Bot – An automated program which carries out tasks on the web including checking websites, page scraping, and summarization of data or web posting.

  • [ ]REDDIT BOT Maybe question and answer bot filter maybe add ability to search for certain key word https://github.com/topielski/RedditBot/blob/master/redditbot.py

  • [ ]Page Scraper – Create an application which connects to a site and pulls out all links, or images, and saves them to a list. For added complexity, organize the indexed content and don’t allow duplicates. Have it put the results into an easily searchable index file.

  • [ ]YOUTUBE PLAY LIST: POSSIBLE? TO MAKE A YOUTBE PLAY LIST WITH YouTube API/search client? FOR KARAOKE OR JUST PLAYING MUSIC?

  • The easiest examples I could think of would be a library that does some math. Odds are the interviewer doesn't know how to do trig functions on a sphere, but it is something easy to look up and implement. You can describe it quickly. No amount of time will help them figure it out. Some people's eyes will just glaze over and they'll assume you're really smart (don't go into too much detail on these guys, show them your communication skills instead).

TESTING

Debugging

DESIGN BEST PRACTICE

the [odin project] (https://www.theodinproject.com/courses/javascript)

DATA STRUCTURE AND Algorithms

CODING PROBLEM WEBSITES

  • Project: Complete all Classic Puzzles - Easy on CodinGame

functional

OPEN SOURCE

GET A JOB

portfolio personal sites list git hub and portfolio tips

  • Project: Create and polish your Portfolio site.
  • Project: Create and polish your Resume/CV.
  • Project: Cracking the Coding Interview on HackerRank

10-interview-questions-every-javascript-developer https://medium.com/javascript-scene/10-interview-questions-every-javascript-developer-should-know-6fa6bdf5ad95

link to reddit post What would really impress me as a hiring employer (disclosure: I'm not, I'm a regular dev) would be if an applicant had made an actually useful, distributed and frequently downloaded tool/app/program that is maintained, documented and well-presented on a "real" website (or app store). Just to name a few examples, I'd respect people such as the devs who make Notepad2, IrfanView, PureText, or any other more or lesser known little tools. There are thousands of mobile apps that would be good examples also. Being able to code and maintain those, regardless of whether they're open source or not, shows a shitload more engagement into coding than tossing up some test projects on GitHub, or doing a few bug fixes and small contributions to an open source project, in my opinion.

Also, rest assured that there are millions of jobs out there where the employer doing the hiring hasn't even heard of GitHub or the concept of a coding portfolio.

GIT

squash git https://www.google.com/search?q=git+squash+commits

Web Development with Computer Science Foundations - comprehensive

If you have any questions, be sure to check the FAQ. In fact, before you even start anything, go read the FAQ. It has a plethora of hints, tips and answers to help you ensure you get the most out of this guide.

Tier 1 - get started

Tier 2 - strengthen your foundation

Tier 3 - build on the foundation

Tier 4 - polish the rough edges

  • Project: Read up on Travis CI - try to incorporate it into any project in active development or which you intend to keep running on the web
  • Course: Linear Algebra - Foundations to Frontiers
  • Project: Clone Twitter - yes, all the functionality
  • Course: Computer Graphics
  • Course: Artificial Intelligence
  • Course: Machine Learning
  • Project: Design, implement, test, and deploy a game that is playable on the web, using the technologies of your choice. The only criteria are that it be playable online, and that it inculde a substantial AI component.
  • Project: Complete all Classic Puzzles - Very Hard on CodinGame in JavaScript
  • Project: Create a node module that will convert markdown to properly formatted html
  • Project: Create an npm module that bootstraps a fullstack application, with Node.js on the backend, and the SPA library/framework of your choice on the frontend. Include a full test suite and comprehensive build processes. Publish it to NPM.
  • Project: Complete all problems from all rounds of the Google Code Jam 2016 - scroll down to the appropriate section
  • Project: Extend your CSS grid framework to include the CSS and JavaScript required to implement 5 to 10 material design components
  • Project: Clone Learn Harmony
  • Project: Clone Slack - the functionality should be complete to the point that one user can create a room, invite other users, and all users of that room can real-time chat. The room should be secure and inaccessible to anyone but those invited.

Get Job ready - JavaScript Edition - Version 2.0

A guide primarily focused on Frontend development, but including just enough of an introduction to Backend to enable an understanding of the "entire process" to prepare for productive entry to a Full Stack team as a confident and capable Frontend Developer.

Tier 0 - Prep

Goal: Be comfortable with git by midway through Tier 1, and comfortable with Precalculus by midway through Tier 2.

Anything in Tier 0 can be studied before beginning Tier 1, or alongside the rest of the guide as you progress through the other Tiers.

Tier 1 - Intro to Programming

Goal: Become Proficient with HTML, CSS and JavaScript.

Tier 2 - Add Complexity

Goal: Become familiar with D3.js and Node.js to strengthen your proficiency with JavaScript by exploring how it's used in a Full Stack application.

Tier 3 - Practice

Goal: Practice Frontend Development in greater depth and continue studying JavaScript, ensuring you understand the algorithms and data structures you're likely to encounter in interviews (and on the job).

  • Project: Read How to Contribute to Open Source - and make two contributions to open source projects (of your choice) by the end of this Tier.
  • Book: Open Data Structures
  • Project: Finish all classic puzzles on CodinGame from easy through hard by the end of the Tier.
  • Project: Clone Medium. Include: create account, create post, publish post, edit post, add topic to post, follow user, follow topic, cheer for post, and home page with feed of recent posts, followed users, and followed topics.
  • Project: Pick a template from here, here or here and implement the frontend of a website with it as your inspiration (do not use its assets)
  • Project: Select an API from Todd Motto's API List and build a frontend-only application powered by data fetched from the API you chose. Consider building it as a Chrome Extension, Mobile, or Electron App
  • Project: Pick a template from here, here or here and implement the frontend of a website with it as your inspiration (do not use its assets)
  • Project: Select an API from Todd Motto's API List and build a frontend-only application powered by data fetched from the API you chose. Consider building it as a Chrome Extension, Mobile, or Electron App
  • Project: Full stack project of your choice (ideas: clone Facebook, Reddit, Netflix, Slack) - Consider building it as a Chrome Extension, Mobile, or Electron App.
  • Project: Full stack project of your choice (make it grand) - or do a one month Speedrun of the FreeCodeCamp Projects.

Tier 4 - Wrap everything up and prep for interviews

Goal: Interview with confidence.

  • Project: Finish any questions you have remaining from JavaScript Interview Prep
  • Project: Finish any of 100 Days of CSS you have yet to complete.
  • Project: Create and polish your Portfolio site.
  • Project: Create and polish your Resume/CV.
  • Project: Cracking the Coding Interview on HackerRank
  • Project: Continue honing your skills as you interview. Prioritize contributing to open source.

What now?

  • If you want to move on to Data Science - hit the Data Science Guide
  • If you preferred the Algorithms and Data Structures - hit the CS-WD Guide
  • If you mostly enjoyed the Web Development - hit the WD-CS Guide

FAQ for this guide

Why is it so much longer than the original Job Ready Guide?

What I've observed over the past 9 months is two phenomena, the first being that many "self-supplemented" with additional beginner projects and resources while working through YDKJS, so I expanded on the beginner section to alleviate the "but what else should I be doing" question. The second is that the most successful learners also supplemented with more involved projects towards the end of the guide, so I added more intricate/advanced projects to meet that need.

Why so much Math and Algorithms?

It's not THAT much math, just through Precalculus so you won't feel so behind the curve when you want to push beyond just "Job Ready" and tackle more involved programming projects. The algorithms -- I've added them to ensure you're prepared and confident you can handle anything you might encounter in an interview.

Where should I deploy my code?

For all projects - store your code on GitHub, GitLab or BitBucket (GitHub preferred if you want it to later be seen by potential employers) and for web projects deploy the code on the web using the service of your choice (GitHub or GitLab projects or Surge.sh are ideal for frontend only projects, while Heroku is a free alternative for backend/fullstack).

Why the change in Project selections?

To give you greater freedom, over the course of studying the guide, to create a portfolio that is unique to you - rather than a clone of the same exact projects that are on the portfolio of every other junior web dev out there.

Do you have a list of helpful links to point me in the right direction if I need a productive break, or need to consult the official docs while I'm working through all this?

Yes, yes I do:

  • For when you need a quick/fun productive break that teaches you how to use CSS to layout a site (revisit this section in Tier 1 - Flexbox Zombies alone will prove extremely helpful learning to layout a page for the early projects.)

  • For when you need a quick/fun productive break in which you also practice JavaScript

  • For when you need assets/ideas

  • Official Docs

    • MDN HTML - for exploring all that HTML has to offer
    • MDN CSS- for exploring all that CSS has to offer
    • MDN JavaScript- for exploring all that JavaScript has to offer
    • Sass - supercharged CSS
    • Node.js - should be your primary reference for building backend projects
    • Express - an excellent framework to accompany Node.js on the backend
    • MongoDB - for storing data
    • Mongoose - access to MongoDB from Node.js made easy(er)
    • Passport.js - remember this link when you have to setup a login system
    • D3 - for creating awesome graphs and charts
    • Angular - option for creating single page apps on the frontend
    • React - option for creating single page apps on the frontend
    • Vue - option for creating single page apps on the frontend
    • Redux - for managing state in a single page app
    • Mocha - venture into testing
    • Karma - venture into testing
    • Jest - venture into testing
    • Webpack - module bundler for use in your build process (so you can minify your HTML/CSS/JavaScript among other things and deliver an optimized build to production)
    • Babel - makes the new JavaScript work on old browsers (or node versions for that matter)
    • Gulp - for automating your workflow
    • ESLint - for helping to keep your code clean
    • Prettier - more help keeping your code clean
    • Travis - continuous deployment (how to trigger a build/deploy whenever you commit your changes via git)

    Get Job ready with 13 projects, 2 courses, and 10 books

Are you working through the FreeCodeCamp curriculum and want to be job ready (for a junior role) without finishing all three certifications? Want to short-circuit the process and get this done quick without getting laughed out of interviews?

Are you thinking "I'll just finish the frontend certification" and start applying?

You're looking at the wrong certification to get prepared and I'll tell you why. The frontend certification does NOT teach you any of the real world skills that go along with programming that you'll need on the job. It doesn't teach you how to work in an editor on your own machine. It doesn't teach you how to run a build process. It doesn't teach you how to share your code in a git repository. And, it doesn't teach you how to deploy your code to a real server on the net.

Have no fear there IS a FCC certification that will get you much, much closer to your goal. Combine it with just a few other resources and you can get there. The backend certification is the one you want to be aiming for.

Finish this list - and you'll walk into interviews with a lot more confidence, and a much better chance of landing that job.

If you have any questions, be sure to check the FAQ. In fact, before you even start anything, go read the FAQ. It has a pleathora of hints, tips and answers to help you ensure you get the most out of this guide.

Read these books, complete these two courses, this certification, and these three projects

Special note: No, you're not done until you finish every step, in order.

If you don't have access to Netflix, or just want an alternative to the Netflix Project

Clone Spotify - you can sign up for a free account. Spotify

You can use their API to search pretty much all of the data they have available: Spotify Web API

You can't actually pull full length versions of the media to play in your app, just play the demo track ;)

If you're thinking @P1xt, you're nuts, I just want to be a frontend developer, this is too much

  • No it's not.
  • This will actually do what the frontend cert alone wont. It will prepare you to do the job of a frontend web developer in today's market. Writing some HTML and CSS isn't all there is to the job. This will prepare you for the rest
  • Don't quit.
  • Don't panic!

studyorder's People

Contributors

krchapman avatar

Watchers

avatar avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.