Menu
Recently, I have started learning ReactJS. The only thing that confuses me is naming folders and files in the React app directory.
To name component files, some people follow TitleCase.js and some follow camelCase.js.
To name app directories, few people follow camelCase and few smallcase or small-case.
I tried to find the official documentation on naming conventions but couldn't. Can someone help me find the right way of naming files in ReactJS?
880
A File Naming Convention (FNC) is a framework for naming your files in a way that describes what they contain and how they relate to other files. Developing an FNC is done through identifying the key elements of the project, the important differences and commonalities between your files.
Open the component's file and start editing away. Then you need to edit your styles, so you also navigate to your styles folder, find the button and open that. Now the component is updated, the tests are broken and some stories need to be updated. You navigate to those respective folders and open tests/button.
Regarding naming conventions, ReactJS is unopinionated.
There isn't an official guideline or statement about the questions you raised. You won't find them in the documentation either.
It's a personal (team) preference. If you struggle to enforce one, you could stick to something like Airbnb's mostly reasonable approach to React and JSX.
PS: As long as you're consistent, I would say you're safe.
100
Based on 'Google JavaScript Style Guide'
File names must be all lowercase and may include underscores (_) or dashes (-), but no additional punctuation. Follow the convention that your project uses. Filenames’ extension must be .js.
36
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
