Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Store components in componentName/index.js instead of componentName/componentName.js #193

Open
Powersource opened this issue Jan 8, 2021 · 2 comments

Comments

@Powersource
Copy link
Member

Referring to the code style mentioned at the end of this section in the ui readme https://github.com/Edgeryders-Participio/realities/blob/master/ui/README.md#code-structure

Each component has its own directory. The directory has at least one .js file with the same name as the directory (this file exports the component itself), and one index.js file that simply imports and re-exports the component. This allows us to import the component in other files without having to repeat the component name (import ExampleComponent from './components/ExampleComponent/ExampleComponent') while still making it easy to search by filename in your text editor or IDE. (Note: If someone knows how to configure Webpack to automatically import a file with the same name as its directory the same way it would an index.js file, please do that!) The component directory can have a components directory inside it to house directories for child components.

The parts that the Code structure section talks about that are taken from the linked blog post are reasonable I think. But this part about having an extra index file for every component I find mostly annoying and I don't really see the advantage that the above quoted part talks about. For me it just causes the paths to components being even longer, and slows down development since every time you want to create a component you have to create 2 files instead of 1. I can sort of see that people can be confused if they have two files with the same name open in their editor, but for me at least that's not a problem since vscode handles that very well, see image.

image

Anyone with opinions on this?

@aerugo
Copy link
Collaborator

aerugo commented Jan 8, 2021

Maybe @erikfrisk ?

@erikfrisk
Copy link
Collaborator

This is purely a question of preference. I tend to prefer this in my editor...

image

... over this...

image

It allows me to see more tabs at once and is a bit more readable IMO. Although I agree that it's annoying to create two files, I don't find it too much of a hassle. Personally I have a template in TextExpander that helps me create the index file quickly.

@Powersource Since you're the main developer on this project now I think you can choose whichever structure makes life easier for you. As long as it's updated everywhere, and the info in the README is updated to reflect the change, I think either way is fine.

@aerugo aerugo added test and removed test labels Feb 8, 2021
@aerugo aerugo assigned aerugo and unassigned aerugo Feb 8, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants