hint: study
/steppedand/separatedbefore starting these exercises
Most of the tutorials you follow online will build projects in a single file. This is great for learning how all the pieces work but is not so great for collaborating or larger projects. Writing your code in a single file is also good for small prototypes before making a full project. So what about refactoring?
"Refactoring" is a general term for rewriting code without changing it's behavior. In this chapter, refactoring will mean splitting the code from one file to many without changing the user's experience.
The ./exercises folder contains a whole bunch of mini-websites for you to study and practice refactoring. Each one implements a single user story, and each one is organized in a similar way.
The goal of these exercises isn't to create amazing projects. Instead the goal to get lots of practice navigating source code, debugging, and refactoring a single file by concern.
The main objective of this module is that you learn how to split your code across multiple files according to the role it plays in your program. After completing a JS 30 tutorial you will take the finished code as a starting point and refactor it into separate folders and files in the javascript-30-starter. There are some recommended challenges in the ./javascript-30 folder, you can do these exercises as a group or individually.
To keep track of your progress through the JS 30 and to store your refactored projects there's HackYourFutureBelgium/javascript-30. In this repo you will find more detailed instructions on how to work your way through these projects.
- javascript30.com
- YouTube Playlist
- wesbos/JavaScript30
- HYF JS 30 Study Guide
- Group Project Starter Repo
- Looking for more like this?
- fun-javascript.com - stepped projects, 👍
- bradtraversy/vanillawebprojects
- aman-maharshi/vanilla-js
- MMTuts Calculator - youtube tutorial
Some examples to study