-
Notifications
You must be signed in to change notification settings - Fork 9
Your folders
Your source files. The starred folders are available to you if you create the toolkit starter-boilerplate with the command dev-toolkit create [app-name] --extended
. The files are compiled and processed through an underlying dev-toolkit
dependency called webpack
.
This is where your client-application is stored. If you want to serve extra files in addition to your client application, you can put them in src/server/public-files
. You should opt for using import
-statements within pages though, so that each page is served only with its own dependencies. See the wiki-entry Dynamic loading of pages
Example use of redux
, a predictable state container for JavaScript apps. Advanced usage, you might not need this if you're just starting out with React.
Store React-components here that are used throughout the Client App. These shared-components will be part of the app.js
-payload, the one that gets served with every page. So be mindful of what components you put in here.
The global style directory which contains font-settings, icon-sets, mixins and everything you need to get started. As with shared-components, this will be served with the app.js
-payload, via Shell.js
.
Your custom javascript utilities. Screen measurement, tracking, translations, animation-generators, console-wrappers, queuing-systems. All that good stuff that have little to do with React and more to do with vanilla javascript.
This folder contains all your React-views. It is at its essence, split in 2. There are 2 main views, one
Put all your pages in here, pages
doesn't mean it has to be a literal "page" in the sense of how one used to think about html-files. Think of it more like a layer that is exchangeable through user interaction but that fits the whole available viewport.
Each page is loaded dynamically, so the assets are only served when needed. You can speed up loading subsequent pages using the DynamicPages
-utility.