The latest articles on Forem by Grover Lee (@grover_lee_74bc3bd45c38a3). https://forem.com/grover_lee_74bc3bd45c38a3 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2222864%2F6b832622-4344-44eb-99a5-568fba1e4bac.png https://forem.com/grover_lee_74bc3bd45c38a3 en Grover Lee Fri, 06 Dec 2024 17:25:19 +0000 https://forem.com/grover_lee_74bc3bd45c38a3/build-large-react-projects-more-intuitive-with-file-nesting-in-vscode-24ng https://forem.com/grover_lee_74bc3bd45c38a3/build-large-react-projects-more-intuitive-with-file-nesting-in-vscode-24ng <p>Build React applications with ease and more intuitive to compose and navigate thanks to the VSCode extension File Nesting Explorer.</p> <p>Hi, community! I would like to share the Free VSCode extension that I worked on in the last months. It helps to create a more intuitive file/folder structure in your React projects.</p> <p>its approach nests files in a way that matches the UI hierarchy of your app. As the Official React docs say "Understanding Your UI as a Tree".</p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8izg5el2x9u5suxz9sfg.gif" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8izg5el2x9u5suxz9sfg.gif" alt="Image description" width="766" height="468"></a></p> <p>I hope you find this useful. I'm open for feedback. If you liked my work, please leave 5 stars. It'll help it to gain more relevance in the marketplace.<br> <a href="https://marketplace.visualstudio.com/items?itemName=GroverLee.file-nesting-explorer" rel="noopener noreferrer">https://marketplace.visualstudio.com/items?itemName=GroverLee.file-nesting-explorer</a></p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fnfr3ggq31bev8neir1v4.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fnfr3ggq31bev8neir1v4.png" alt="Image description" width="800" height="160"></a></p> <p>Also, I wrote a Medium post explaining a little bit more. If you like it, don't forget to leave some claps &lt;3</p> <p><a href="https://medium.com/@brucegroverlee/react-file-nesting-design-pattern-74fe6edba127" rel="noopener noreferrer">https://medium.com/@brucegroverlee/react-file-nesting-design-pattern-74fe6edba127</a></p> react webdev programming reactnative