I’ve finished HTML, CSS, Javascript part and now I am learning React. I really like the way how it is taught in FCC. However, I have a concern at this point.
While I was studying React, I felt the concept is a bit confusing so I bought a course from Udemy as my supplementary material. In that Udemy course, I got to know about development environment setup, workflow and deployment stuff which was very confusing for me.
I have a little bit of development environment knowledge that I learned through Colt Steele’s web development bootcamp. However, that was development on C9 platform and deployment through heroku was not touched in deep.
If I want to practice setting my own development environment and learn workflow using babel or webpack, Where can I start? It is a bit frustrating that I almost finished the front-end part through FCC but I know nothing about them.
Or If I progress further from the curriculum, will I see them ?? Please advise me. Thank you very much!
I would focus on learning the tools you need, when you need them.
Tooling can really get out of hand and often takes you into massive time sink rabbit holes, which you don’t want unless you need to. I’m not saying don’t learn the tools, but learn them for a reason and not just to learn them. There are maybe a few exceptions, like tools you wouldn’t use unless you just started using them because you have to know about them, like how to use Git and Github.
Anyway, all the tools have documentation and tutorials, seek them out when you need them.
As far as dev enviro, there are a lot of options - VSC, Atom, Sublime, Web Storm. Those are powerful editors that have a lot of plugins.
As far as deployment, probably the simplest and most common with React would be to use the Node program create-react-app to work on the app. Then when you want to deploy, you can run the “build” script in create-react-app and copy those generated files to whatever web host you have. The other advantage of create-react-app is that it is built on webpack so you can easily break your components into separate files. This is a an important thing as your programs get bigger.
As to how to structure a React app, there are different ways. I like putting different components into different folders in a structure that mimics structure of the app. Within those folders there may be container and presentational components. If a component gets used a lot, I may put it in a folder called common. Of the src directories, I also have folders like utilities, redux, assets, etc. This is only one possible structure. Try looking through other people’s code and seeing what some other options are. On my job, they use a layer approach so I have to use that there. It’s a good paradigm, just different.
Yes, there are a lot of holes in FCC. It’s not meant to be comprehensive. I’m not sure if there is a way for them to effectively teach and test you on these things. It would end up being a lot of videos and I think they are trying to not just become a site of videos.
But yes, making the leap from the FCC cocoon to the “real” world is tough. Many of us struggled with the same thing. So my suggestion is to keep struggling. Look for youtube videos and read articles. You’ll struggle for a while but eventually it will start to sink in.