Learn how to build a VS Code clone with Redux, Typescript, Auth0, Material UI and Jest
In this course, you will learn how to build a simple yet complex app (a code editor in the browser inspired in VS Code using the Monaco Editor). You will learn a lot of things from such a simple project:
At the end of this course, you will be able to transfer all the knowledge you will get to a real world application. You can also take this project as a portfolio project. It contains lots of things that you would use in a big React application.
Lots of courses concentrate on the basics of React. In this course we will be building a simple yet complex app. You will see that we will cover lots of things in such a short amount of time!
In the course project, you will build two new features: the ability to remove the current files and the ability to add another directory without removing current code. The first feature should be fairly easy. We already learned how to reset the state where the files are stored. You only need to reset that state. However, the interesting part comes when we mix the first feature with the second feature. The second feature implies that the state shape should be different. Maybe it can be a map where we map a newly generated id of the new directory to an array containing the files. Now, if we want to delete a single directory, we would just need to delete the key from this map. Other reducers should also be modified! The second feature is basically going to change the whole state shape and that's why this is an interesting project!
You will learn (unconsciously) about data normalization by doing this, so make sure to read about this topic after you finish the project!