├── LICENSE
├── README.md
├── log.md
└── resources.md
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2017 Shovan Chatterjee
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Full Stack Web Developer Path
2 | This is a guide to learn full-stack web development. It is focused on full-stack JavaScript. It covers all the way from the fundamentals to React and Node.
3 | The idea behind this repo is, to have a place to log the learning process in an organized way.
4 | This can be used as a companion to [FreeCodeCamp](https://www.freecodecamp.org/) curriculum
5 |
6 | ------
7 |
8 | ## [Coding log](log.md)
9 |
10 | ## The Fundamentals
11 |
12 | | Progress | Type | Item | Project(s) | Date |
13 | | :------: | ------ | ------ | ------------ | :-------: |
14 | | | Course | [CS50](https://courses.edx.org/courses/course-v1%3AHarvardX%2BCS50%2BX/) on edX | ||
15 | | | Course | [Team Treehouse](https://teamtreehouse.com/tracks) or [Codeschool](https://www.codeschool.com/learn/html-css)'s HTML, CSS Path (Paid) OR Shay Howe's [HTML,CSS](http://learn.shayhowe.com/html-css/) Course | | |
16 | | | Project | FCC Front End Project - [Build Your Portfolio](https://www.freecodecamp.com/challenges/build-a-personal-portfolio-webpage) | | |
17 | | | Course | Learn to use [Command line](https://commandlinepoweruser.com/)| ||
18 | | | Course | Learn Version Control (Git) - [Git course @Codeschool](https://try.github.io/levels/1/challenges/1) OR [Udacity - Git and Github](https://in.udacity.com/course/how-to-use-git-and-github--ud775)| | |
19 | | | Course | Learn Flexbox - [Flexbox.io](https://flexbox.io/) OR [Flexboxfroggy](http://flexboxfroggy.com/) | | |
20 | | | Course | Learn Sass - [Sass-guide](http://sass-lang.com/guide) OR [Sass Tutorials](http://www.sassshop.com/#/) | | |
21 | | | Project | Refactor the portfolio site layout and CSS using Flexbox and Sass | | |
22 | | | Course | [Watch and Code - Practical Javascript](https://watchandcode.com/p/practical-javascript) | | |
23 | | | Book | [Eloquent Javascript](http://eloquentjavascript.net/) | | |
24 | | | Project | Do FCC [Javascript Basic Algorithm Challenges](https://www.freecodecamp.org/map) | | |
25 | | | Book | Learn DOM manipulation - [DOM Enlightenment](http://domenlightenment.com/) | | |
26 | | | Project | Make a todo list webapp | | |
27 | | | Course | Learn [AJAX](https://in.udacity.com/course/asynchronous-javascript-requests--ud109) | | |
28 | | | Project | FCC Intermediate Project - [Build a Random Quote Generator](https://www.freecodecamp.com/challenges/build-a-random-quote-machine) | | |
29 | | | Project | FCC Intermediate Project - [Build a Local Weather App](https://www.freecodecamp.com/challenges/show-the-local-weather) | | |
30 | | | Project | FCC Intermediate Project - [Build a Wikipedia Viewer](https://www.freecodecamp.com/challenges/build-a-wikipedia-viewer) | | |
31 | | | Project | FCC Intermediate Project - [Build a Twitch TV Viewer](https://www.freecodecamp.com/challenges/use-the-twitchtv-json-api) | | |
32 | | | Course | Learn ES6 - [Wes Bos - ES6 for Everyone](https://es6.io/) (Paid) OR [ES6 Crash Course](https://laracasts.com/series/es6-cliffsnotes)|
33 | | | Course | [Javascript30](https://javascript30.com/) | | |
34 | | | Project | Do FCC [Javascript Intermediate Algorithm Challenges](https://www.freecodecamp.org/map) | | |
35 | | | Project | FCC Advanced Project - [Build a Javascript Calculator](https://www.freecodecamp.com/challenges/build-a-javascript-calculator) | | |
36 | | | Project | FCC Advanced Project - [Build a Pomodoro Clock](https://www.freecodecamp.com/challenges/build-a-pomodoro-clock) | | |
37 | | | Project | FCC Advanced Project - [Build a Tic Tac Toe game](https://www.freecodecamp.com/challenges/build-a-tic-tac-toe-game) | | |
38 | | | Project | FCC Advanced Project - [Build a Simon Game](https://www.freecodecamp.com/challenges/build-a-simon-game) | | |
39 | | | Milestone | FreeCodeCamp Front End Certificate | | |
40 | | | Course | [Optional] [JavaScript: Understanding the Weird Parts](https://www.udemy.com/understand-javascript/) (Paid) | |
41 | | | Book | [YDKJS: Up & Going](https://github.com/getify/You-Dont-Know-JS/blob/master/up%20&%20going/README.md#you-dont-know-js-up--going) | | |
42 | | | Book | [YDKJS: Scope & Closures](https://github.com/getify/You-Dont-Know-JS/blob/master/scope%20&%20closures/README.md#you-dont-know-js-scope--closures) | | |
43 | | | Book | [YDKJS: this & Object Prototypes](https://github.com/getify/You-Dont-Know-JS/blob/master/this%20&%20object%20prototypes/README.md#you-dont-know-js-this--object-prototypes) | | |
44 | | | Book | [YDKJS: Types & Grammar](https://github.com/getify/You-Dont-Know-JS/blob/master/types%20&%20grammar/README.md#you-dont-know-js-types--grammar) | | |
45 | | | Book | [YDKJS: Async & Performance](https://github.com/getify/You-Dont-Know-JS/blob/master/async%20&%20performance/README.md#you-dont-know-js-async--performance) | | |
46 | | | Book | [YDKJS: ES6 & Beyond](https://github.com/getify/You-Dont-Know-JS/blob/master/es6%20&%20beyond/README.md#you-dont-know-js-es6--beyond) | | |
47 |
48 |
49 | ## React
50 |
51 | | Progress | Type | Item | Project(s) | Date |
52 | |:------:|------|------|------------|:-------:|
53 | | | Course | Learn React - [React For Beginners - Wes Bos](https://reactforbeginners.com/) (Paid) or [React Fundamentals - Tyler Mcginnis](https://reacttraining.com/online/react-fundamentals) (Paid) OR [Learn React @Egghead.io](https://egghead.io/courses/start-learning-react) | | |
54 | | | Course | Learn Redux - [Redux course - Wes Bos](https://learnredux.com/) | | |
55 | | | Project | FCC React Project - [Build a Markdown Previewer](https://www.freecodecamp.com/challenges/build-a-markdown-previewer) | | |
56 | | | Project | FCC React Project - [Build a Recipe Box App](https://www.freecodecamp.com/challenges/build-a-recipe-box) | | |
57 | | | Project | Clone the Netflix interface using React - pulling data from [the Movie DB API](https://www.themoviedb.org/documentation/api) | | |
58 | | | Project | Clone [this Admin template](http://rubix410.sketchpixy.com/ltr/dashboard) using React | | |
59 |
60 | ## Backend (Node)
61 | | Progress | Type | Item | Project(s) | Date |
62 | |:------:|------|------|------------|:-------:|
63 | | | Course | [Learn Node - Wes Bos](https://learnnode.com/) (Paid) OR Nodeschool.io [Tutorials](https://nodeschool.io/) | | |
64 | | | Project | FCC Backend Project - [Timestamp Microservice](https://www.freecodecamp.com/challenges/timestamp-microservice) | | |
65 | | | Project | FCC Backend Project- [Request Header Parser Microservice](https://www.freecodecamp.com/challenges/request-header-parser-microservice) | | |
66 | | | Project | FCC Backend Project- [URL Shortener Microservice](https://www.freecodecamp.com/challenges/url-shortener-microservice) | | |
67 | | | Project | FCC Backend Project- [Image Search Abstraction Layer](https://www.freecodecamp.com/challenges/image-search-abstraction-layer) | | |
68 | | | Project | FCC Backend Project- [File Metadata Microservice](https://www.freecodecamp.com/challenges/file-metadata-microservice) | | |
69 | | | Project | FCC Backend Project- [Build a Voting App](https://www.freecodecamp.com/challenges/build-a-voting-app) | | |
70 | | | Project | FCC Backend Project- [Build a Nightlife Coordination App](https://www.freecodecamp.com/challenges/build-a-nightlife-coordination-app) | | |
71 | | | Project | FCC Backend Project- [Chart the Stock Market](https://www.freecodecamp.com/challenges/chart-the-stock-market) | | |
72 | | | Project | FCC Backend Project- [Manage a Book Trading Club](https://www.freecodecamp.com/challenges/manage-a-book-trading-club) | | |
73 | | | Project | FCC Backend Project- [Build a Pinterest Clone](https://www.freecodecamp.com/challenges/build-a-pinterest-clone) | | |
74 | | | Milestone | FreeCodeCamp BackEnd certificate | | |
75 |
76 |
77 | ## Extra Goals
78 | * Learn to setup your own local developement environment
79 | * Deploy completed projects using [Github Pages](https://pages.github.com/) or [surge.sh](http://surge.sh/) (Both front-end only) Or [Glitch](https://glitch.com/) (Works with back-end too)
80 | * Learn about build tools like [Gulp](https://gulpjs.com/) and include them in projects
81 | * Learn about linting. Use linters like [ESLint](https://eslint.org/) for Javascript , [Stylelint](https://stylelint.io/) for CSS in your projects.
82 | * Learn about CSS conventions like [BEM](http://getbem.com/introduction/), [SMACSS](https://smacss.com/book/).
83 | * Every week, write a medium post about that week's learnings.
84 | * Make a habit of coding daily. Try [#100DaysofCode Challenge](http://100daysofcode.com/)
85 |
86 |
87 | ## How to use the guide
88 | * To start using the guide, fork the repo.
89 |
90 | ## Notes
91 | * This is a template. You can customize it, add or remove courses as per your choices.
92 | * If you like this repo and find it useful, please consider ★ starring it (on top right of the page) :)
93 | * If you have any questions, feel free to ask me on twitter : **[Shovan Chatterjee](https://twitter.com/shovan_ch)** [](https://twitter.com/intent/follow?screen_name=shovan_ch)
94 |
95 | ## Attribution
96 | Inspired by [p1xt guides](https://github.com/P1xt/p1xt-guides), [My journey to becoming a web developer from scratch without a CS degree (and what I learned from it)](https://medium.freecodecamp.com/my-journey-to-becoming-a-web-developer-from-scratch-without-a-cs-degree-2-years-later-and-what-i-4a7fd2ff5503)
97 |
--------------------------------------------------------------------------------
/log.md:
--------------------------------------------------------------------------------
1 | # 💯 100 Days Of Code - Log
2 |
3 | **Inspired by [Alexander Kallaway](https://twitter.com/ka11away)'s #100DaysOfCode challenge. More details about the challenge can be found here: [100daysofcode.com](http://100daysofcode.com/ "100daysofcode.com") or [the official repo](https://github.com/Kallaway/100-days-of-code "the official repo").**
4 | ***
5 | **Target** : ***Learn and Code for atleast 1 hour everyday for 100 days***
6 |
7 | **Start Date** :
8 |
9 | Day :
10 | ------
11 | **Today's Progress** :
12 |
13 | **Thoughts** :
14 |
15 | **Link to work** :
16 |
17 | **Thing(s) learned**:
18 |
19 |
20 |
21 |
--------------------------------------------------------------------------------
/resources.md:
--------------------------------------------------------------------------------
1 | # Resources
2 |
3 | ## Helpful Articles
4 |
5 | ### Learning
6 | 1. [Learning How to Learn: The Most Important Developer Skill](https://medium.freecodecamp.com/learning-how-to-learn-the-most-important-developer-skill-7bf62dfaf67d)
7 | 2. [What I tell all new programmers](https://josephg.com/blog/what-i-tell-all-new-programmers/)
8 | 3. [Why Learning to Code is So Damn Hard](https://www.vikingcodeschool.com/posts/why-learning-to-code-is-so-damn-hard)
9 | 4. [The Key To Accelerating Your Coding Skills](http://blog.thefirehoseproject.com/posts/learn-to-code-and-be-self-reliant/)
10 | 5. [Please don’t quit — every expert was once a beginner](https://medium.freecodecamp.com/please-dont-quit-every-expert-was-once-a-beginner-6d8f8933a338)
11 | 6. [Learning to Code: When It Gets Dark](https://medium.freecodecamp.com/learning-to-code-when-it-gets-dark-e485edfb58fd)
12 | 7. [How to Get a Developer Job in Less Than a Year](https://medium.freecodecamp.com/how-to-get-a-developer-job-in-less-than-a-year-c27bbfe71645)
13 |
14 | ### Web Developement General
15 | 1. [Modern Web Development](https://hackernoon.com/modern-web-development-bf0b2ef0e22e)
16 | 2. [Git under the hood](https://medium.freecodecamp.com/git-internals-for-curious-developers-a1e44e7ecafe)
17 | 3. [A Brief History of the Command Line](https://medium.freecodecamp.com/the-command-line-1fdbc692b3bf)
18 |
19 | ### Javascript
20 | 1. [A Brief History of JavaScript](https://auth0.com/blog/a-brief-history-of-javascript/)
21 | 2. [Glossary of Modern JavaScript Concepts: Part 1](https://auth0.com/blog/glossary-of-modern-javascript-concepts/)
22 | 3. [Glossary of Modern JavaScript Concepts: Part 2](https://auth0.com/blog/glossary-of-modern-javascript-concepts-part-2/)
23 | 4. [A Study Plan To Cure JavaScript Fatigue](https://medium.freecodecamp.com/a-study-plan-to-cure-javascript-fatigue-8ad3a54f2eb1)
24 |
25 | ### Concepts Explained
26 |
27 | * [How the Web Works: A Primer for Newcomers to Web Development ](https://medium.freecodecamp.com/how-the-web-works-a-primer-for-newcomers-to-web-development-or-anyone-really-b4584e63585c)
28 | * [How the Web Works Part II: Client-Server Model & the Structure of a Web Application](https://medium.freecodecamp.com/how-the-web-works-part-ii-client-server-model-the-structure-of-a-web-application-735b4b6d76e3)
29 | * [How the Web Works Part III: HTTP & REST](https://medium.freecodecamp.com/how-the-web-works-part-iii-http-rest-e61bc50fa0a#.h2reqv9ey)
30 | * [The CSS Box Model Explained by Living in a Boring Suburban Neighborhood](https://medium.freecodecamp.com/css-box-model-explained-by-living-in-a-boring-suburban-neighborhood-9a9e692773c1)
31 | * [CSS Floats Explained By Riding An Escalator](https://medium.freecodecamp.com/css-floats-explained-by-riding-an-escalator-57fa55232333)
32 | * [Understanding Flexbox: Everything you need to know](https://medium.freecodecamp.com/understanding-flexbox-everything-you-need-to-know-b4013d4dc9af)
33 | * [CSS Flexbox Explained by Road Tripping Across the Country](https://medium.freecodecamp.com/css-flexbox-explained-by-road-tripping-across-the-country-1217b69c390e)
34 | * [How Flexbox works — explained with big, colorful, animated gifs](https://medium.freecodecamp.com/an-animated-guide-to-flexbox-d280cf6afc35)
35 | * [Even more about how Flexbox works — explained in big, colorful, animated gifs](https://medium.freecodecamp.com/even-more-about-how-flexbox-works-explained-in-big-colorful-animated-gifs-a5a74812b053)
36 | * [CSS Selectors Explained By Going Car Shopping](https://medium.freecodecamp.com/css-selectors-explained-by-going-car-shopping-51a383f6eb4b)
37 | * [CSS Positioning Explained By Building An Ice Cream Sundae](https://medium.freecodecamp.com/css-positioning-explained-by-building-an-ice-cream-sundae-831cb884bfa9)
38 | * [CSS display explained by packing a suitcase](http://www.rtfmanual.io/blocksuitcase.pdf)
39 | * [The Basics of DOM Manipulation in Vanilla JavaScript (No jQuery)](https://www.sitepoint.com/dom-manipulation-vanilla-javascript-no-jquery/)
40 | * [AJAX Explained by Upgrading Your Video Game Character](https://medium.freecodecamp.com/ajax-explained-by-upgrading-your-video-game-character-17d26305163c)
41 | * [React Props/State Explained Through Darth Vader’s Hunt for the Rebels](https://medium.freecodecamp.com/react-props-state-explained-through-darth-vaders-hunt-for-the-rebels-8ee486576492)
42 | * [Model-View-Controller (MVC) Explained Through Ordering Drinks At The Bar](https://medium.freecodecamp.com/model-view-controller-mvc-explained-through-ordering-drinks-at-the-bar-efcba6255053)
43 | * [The Basics Of Git Explained by designing a new car](https://pixelpioneers.co/blog/2017/git-basics-explained-by-designing-a-new-car)
44 | * [Learn Google Analytics from Santa and his Elves](https://medium.freecodecamp.com/learn-google-analytics-from-santa-and-his-elves-59ea82fbd99a)
45 | * [User Experience explained in 5 minutes for newbie front end developers](https://medium.freecodecamp.com/user-experience-explained-in-5-minutes-for-newbie-front-end-developers-1293c1521407)
46 | * [React for Visual learners](https://medium.com/coding-artist/react-js-for-the-visual-learner-chapter-2-what-is-react-and-why-is-it-cool-d1f9bac69a63)
47 |
48 | ### Design
49 | * [Fundamentals of Design](https://medium.freecodecamp.org/before-you-can-master-design-you-must-first-master-the-fundamentals-1981a2af1fda?ref=quuu)
50 | * [7 Rules for creating gorgeuos UI - Part1](https://medium.com/@erikdkennedy/7-rules-for-creating-gorgeous-ui-part-1-559d4e805cda)
51 | * [7 Rules for creating gorgeuos UI - Part2](https://medium.com/@erikdkennedy/7-rules-for-creating-gorgeous-ui-part-2-430de537ba96)
52 | * [UI Design Principles](https://medium.com/@oymanezzat/ui-design-famous-principles-41269344dd7b)
53 |
54 |
55 |
56 |
57 |
58 |
--------------------------------------------------------------------------------