Pour tout problème contactez-nous par mail : support@froggit.fr | La FAQ :grey_question: | Rejoignez-nous sur le Chat :speech_balloon:

Skip to content
Snippets Groups Projects
README.md 5.03 KiB
Newer Older
# Website
Christophe Chaudier's avatar
Christophe Chaudier committed

This website is built using [Docusaurus 2](https://docusaurus.io/), a modern static website generator.
Christophe Chaudier's avatar
Christophe Chaudier committed

[See here for more](https://lab.frogg.it/lydra/www/docusaurus-bootstrap/-/blob/main/doc/referentiel_liens.md). (🇫🇷)
Christophe Chaudier's avatar
Christophe Chaudier committed

## Installation

```console
npm install
```
## Local Development
```console
npm start
```
This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server.
## Build
```console
npm run build
This command generates static content into the `build` directory and can be served using any static contents hosting service.
## Create a new page
[Follow this doc](https://lab.frogg.it/lydra/www/docusaurus-bootstrap/-/blob/main/doc/pages.md). (🇫🇷)
[Follow this doc](https://lab.frogg.it/lydra/www/docusaurus-bootstrap/-/blob/main/doc/sections.md). (🇫🇷)
## Update the theme
[Follow this doc](https://lab.frogg.it/lydra/www/docusaurus-bootstrap/-/blob/main/doc/theme.md). (🇫🇷)
## Components
[Follow this doc](https://lab.frogg.it/lydra/www/docusaurus-bootstrap/-/blob/main/doc/components.md) (🇫🇷)

## Three structure
```
├── babel.config.js          // contains configurations to Babel, a JavaScript compiler
├── blog                     // contains the blog Markdown files.
├── docs                     // contains the Markdown files for the docs.
├── docusaurus.config.js     // a config file containing the site configuration.
├── package.json             // a Docusaurus website is a React app. You can install and use any npm packages
├── README.md                   
├── sidebars.js              // used to specify the order of documentations in the sidebar
├── src                      // non-documentation files like pages or custom React components
│   ├── components           // contains React reusable Components and it's CSS modules
│   ├── css                  // global CSS
│   └── pages                // pages Components
├── static                   // static directory
    └── img                  // images folder
```
More details on Project structure:
* `/blog/` - You can delete the directory if you do not want/need a blog. More details can be found in the [blog guide](https://docusaurus.io/docs/blog)
* `/docs/` - Customize the order in sidebars.js. More details can be found in the [docs guide](https://docusaurus.io/docs/docs-markdown-features)
* `/src/` - You don't have to strictly put your non-documentation files in here but putting them under a centralized directory makes it easier to specify in case you need to do some sort of linting/processing
  * `/src/pages` - More details can be found in the [pages guide](https://docusaurus.io/docs/creating-pages)
* `/static/` -  Any contents inside here will be copied into the root of the final `build` directory
* `/docusaurus.config.js` -  This is the equivalent of `siteConfig.js` in Docusaurus v1
## Naming conventions
- *Components* files and folders must be named using camel case (e.g `Hello world component` = `HelloWorldComponent`)
- *Page* files must be named using kebab case, all lower cases (e.g `Hello world page` = `hello-world-page`)
- *Style classes* must be name using kebab case as well, all lower cases (e.g `Hello world title` = `hello-world-title`)
## Image organisation
Static assets are arranged in a certain way, all images are contained in subfolders within the `img` folder, the subfolder depends on how they are used. The name must be the same. Following this structure: 
* An image used on a page will be in a subfolder named after the page, within the `pages` folder. e.g:
__You would find the file `kermit.png` used on the `about` page at `img/pages/about/kermit.png`__
* An image used in a component will be in a subfolder named after the component, within the `components` folder. e.g:
__You would find the file `kermit.png` used on the `slider` component at `img/components/slider/kermit.png`__
* An image used on a documentation page will be in a subfolder named after the page, within the `docs` folder. e.g:
__You would find the file `kermit.png` used on the `management` documentation page at `img/docs/management/kermit.png`__
* Global images (e.g: used in the footer) will be in the `img/theme/` subfolder.
## License
[![froggit.fr Copyright (c) 2021-present Lydra](https://cdn.icon-icons.com/icons2/2622/PNG/512/legal_license_mit_icon_157533.png)](https://choosealicense.com/licenses/mit/)
Copyright (c) 2021-present Lydra

Portions of this software are licensed as follows:
- The graphic charter (logo, association of colors and fonts) is not under free license and belongs to Oxalis - Lydra.
- All content residing under the "docs/" directory of this repository is licensed under ["Creative Commons: CC BY-SA 4.0 license"](https://creativecommons.org/licenses/by-sa/4.0/).
- Content outside of the above-mentioned directories or restrictions above is available under the [MIT license](https://choosealicense.com/licenses/mit/) as defined below.