Webapp
Installation
Copy:
Configure the files according to your needs and your local setup.
Build for Development
Build for Production
Run tests
We ensure the quality of our frontend code by using
ESLint for checking our JavaScript code
Jest and Vue Test Utils to unit test our components
Storybook to document and manually test our components in an isolated playground
For more information see our frontend testing guide. Use these commands to run the tests:
After starting the application following the above guidelines, open new terminal windows for each of these commands:
You can then visit the Storybook playground on http://localhost:3002
Styleguide Migration
We are currently in the process of migrating our styleguide components and design tokens from the Nitro Styleguide into the main Human Connection repository and refactoring our components in the process. During this migration, our new components will live in a _new/
folder to separate them from the old, yet untouched components.
Folder Structure
The folder structure we are following is prescribed by Nuxt.js:
assets contains icons, images and logos in
svg
format and all shared SCSS files such astokens
components separated into two sub-folders:
generic are the generic building blocks of the app – small, reusable and usually not coupled to state
features are composed of components but tied to a particular function of the app (e.g.
comment
orpost
)
layouts can use components to create layout templates for pages
pages are the entry points for all
routes
in the app and are composed of layouts, features and components
Last updated