|
Dan Abramov
@
dan_abramov
London, England
|
|
Working on @reactjs. Co-author of Redux and Create React App. Building tools for humans.
|
|
|
51 265
Туитове
|
824
Следван/а
|
132 731
Последователи
|
| Туитове |
|
Dan Abramov
@dan_abramov
|
27 с |
|
It is a guideline though. It means literally “start by putting everything in one file; when it feels like it’s annoying, start splitting them up; what THAT gets annoying, maybe add some folders”.
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
1 мин |
|
I don’t disagree! When you have a good idea of *why* you adopt a certain file structure it can be a real blessing. People who feel this way have usually already chosen one though. It’s beginners who are confused because they feel they *must* abide by certain rules.
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
3 мин |
|
CRA doesn’t structure your app at all beyond dividing it in two folders: one for source, and one for other assets. That’s as minimal as possible without adding configuration. What you do in those folders is completely up to you.
|
||
|
|
||
| Dan Abramov ретуитна | ||
|
pia mancini
@piamancini
|
27 мин |
|
I just published “Introducing BackYourStack.” medium.com/open-collectiv…
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
12 мин |
|
Okay, I give in. I wrote a guide on the most scalable file structure for React projects. I’m using it every day. Best part: it works for Vue projects too. Hope it’s helpful! ✨ react-file-structure.surge.sh
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
31 мин |
|
The paradox is that people crave “React file structure“ most of all while React specifically doesn’t give you any limitations
|
||
|
|
||
| Dan Abramov ретуитна | ||
|
Ryan Florence
@ryanflorence
|
1.08 |
|
Woah, next.js + mdx + react-live is gonna make for the best documentation creation and consumption experience I think I've ever seen.
Example on the left, markdown file that becomes the page on the right, code is displayed, renders, and *is editable* in the browser! pic.twitter.com/GuirPb3ewS
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
34 мин |
|
People are asking for it when it’s *not* enforced though. They’re given full freedom and ask for guidance. I wonder if it’s better to offer superficial advice (which doesn’t actually matter) or to teach that it doesn’t matter
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
35 мин |
|
Let’s call it “dropbox file structure”
|
||
|
|
||
| Dan Abramov ретуитна | ||
|
Dan Abramov
@dan_abramov
|
38 мин |
|
I don’t have an answer. This topic is confusing me. My preferred file structure is “create a new folder when it feels like it’s hard to find a file in a pile of other files” and “combine folders when it feels like there’s too many of them and it’s hard to navigate them”.
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
38 мин |
|
I don’t have an answer. This topic is confusing me. My preferred file structure is “create a new folder when it feels like it’s hard to find a file in a pile of other files” and “combine folders when it feels like there’s too many of them and it’s hard to navigate them”.
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
41 мин |
|
Next time you write about the file structure you’re using, think before calling your article “React file structure“ or “Vue file structure”. How you organize your files has nothing to do with what renders rectangles on your screen. It’s “JavaScript project file structure”!
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
42 мин |
|
Maybe they have troubles with this because we’re teaching them that different libraries have different “file structures”. Maybe it’s a misleading thing to teach, and it would be better to approach it from a more generic angle.
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
43 мин |
|
I finally understood why questions about file structure of React projects confuse me. It’s because any answers aren’t React-specific. Is it time to start saying “JavaScript front-end file structure” instead of “library X file structure”? twitter.com/dan_abramov/st…
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
45 мин |
|
What *would* make sense to me is a generic discussion, e.g. “how do you organize files in a JavaScript front-end project”. I don’t understand what’s the point of “React file structure” or “Vue file structure” and why they would be any different.
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
46 мин |
|
I’m supportive of publishing a recommendation if people feel strongly about it. But it’s perplexing to me why a *library* needs to recommend how you structure your folders on the disk, and why people feel like the recommendation has to come from a *specific* lib they’re using.
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
48 мин |
|
Neither React nor Vue have any special opinions about files. They’re not tied to filesystem in any way. From this follows that any file structure that works great with Vue would also work great with React.
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
48 мин |
|
What I’m saying is that all of these libraries are component-oriented. Whether React docs say something or not, I don’t understand why you couldn’t teach the same file structure that worked for you with Angular or Vue, to React users 🙂
|
||
|
|
||
|
Dan Abramov
@dan_abramov
|
58 мин |
|
If you’ve seen a successful project structure in Angular/Vue, why would a React one be different?
|
||
|
|
||
| Dan Abramov ретуитна | ||
|
Tyler McGinnis
@tylermcginnis
|
7.08 |
|
👋 Tonight is day 1 of the free, online React Native Bootcamp by @dabit3
He'll be covering
- What is React Native?
- Why use React Native?
- Pros and Cons of React Native
- Your first React Native App
- React in the React Native Environment
tylermcginnis.com/free-react-nat…
|
||
|
|
||