name	route
Getting Started	/

Z1 Training

Launch the app

First, we need to install all dependencies with yarn:

yarn

After that, you can run the project in dev mode:

yarn start

Project structure

Configuration files

• config
  • postcss.config.js. PostCSS config.
  • webpack.common.js. Webpack common config.
  • webpack.config.babel.js. Webpack main config file. If you run webpack using the CLI you should point to this configuration file and use the --env parameter.
  • webpack.dev.js. Webpack dev environment config.
  • webpack.production.js. Webpack production environment config.
• .babelrc. Babel config.
• .eslintrc. ESLint config.
• .prettierrc. Prettier config.
• package.json. Contains the project dependencies and some scripts.
• tsconfig.json. TypeScript config.

Source code and assets

• src
  • styles. SASS styles.
    • lib. Folder that includes some external libraries that don't have a NPM package.
    • _fonts.scss. Fonts used in the project.
    • _functions.scss. [INJECTED] Functions that can be used inside all components.
    • _reset.scss. CSS Reset.
    • _responsive.scss. [INJECTED] Breakpoints configuration for responsive design. Also imports sass-mq.
    • _transitions.scss. [INJECTED] Transitions that can be used inside all components.
    • _variables.scss. [INJECTED] Variables that can be used inside all components. CSS Variables don't belong here!
    • global.scss. Global styles. For example, CSS variables should be defined here.
  • App.tsx. Component that represents the app.
  • index.tsx. Entry point of the entire application. Mounts the App and imports the global styles.
• public. Here you can include files that won't be transformed in the build pipeline, with the exception of the index.html, which acts as a template.
  • index.html