File structure
Key files and folders
This is not a complete list of files and folders. Just the key files you'll need to know about to get started.
|- build
|- config
|- i18n
index.js
moduleOverride.js
|- node_modules
package.json
prettier.config.js
|- public
|- src
App.js
|- assets
|- components
manifest.webmanifest
|- pages
|- styling
icon.js
theme.js
sw.js
build
The build directory contains the built assets for your site. This should not be committed to your git repo.
config
The config directory contains Falcon Client config json files (default.json
, production.json
etc). In these files you'll be able to configure things like the port Falcon Client is running on.
i18n
This directory contains your sites translations. The structure is <language>/translations.json
. e.g. en/translations.json
for english translations.
index.js
This is where everything starts. Other that exporting the app and client state nothing much happens here.
moduleOverride.js
From this file you can override components from within node packages. This is create if you want to change a component from @deity/falcon-ui-kit
for example. Find out more about overriding.
node_modules
This is where npm packages are installed to.
package.json
This defines project details including package requirements.
prettier.config.js
Falcon Platform uses Prettier for code formatting. You can change the config in this file.
public
This folder is publicly accessible. You can use it for files such as robots.txt
.
src/App.js
This file contains your app. Everything in Falcon Client starts here. A lot happens in this file including mapping components to routes.
src/assets
This is where static assets live. It's a great place to put files like touch icons and other similar images.
src/components
This is the home to your global components such as the header.
src/manifest.webmanifest
This file contains your sites manifest.json
config.
src/pages
This is the home to page & page specific components. You'll find most of the checkout and shop components in here.
src/styling/icon.js
This file exports SVG icons to be used throughout the site.
src/styling/theme.js
This file contains your theme variables such as colors and spacing. More information on theming.
sw.js
This is compiled into your sites service worker. You can add to this if you need custom service worker code.