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 4.97 KiB
Newer Older
  • Learn to ignore specific revisions
  • # 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](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/froggit/www/froggit.fr/-/blob/master/doc/pages.md).
    
    ## Create a new section
    
    [Follow this doc](https://lab.frogg.it/froggit/www/froggit.fr/-/blob/master/doc/sections.md).
    
    ## Update the theme
    
    [Follow this doc](https://lab.frogg.it/froggit/www/froggit.fr/-/blob/master/doc/theme.md).
    
    ## Components
    
    [Follow this doc](https://lab.frogg.it/froggit/www/froggit.fr/-/blob/master/doc/components.md)
    
    ## Three structure
    
    ```
    ├── babel.config.js          // contains configurations to Babel, a JavaScript compiler
    ├── blog                     // contains the blog Markdown files.
    ├── doc                      // contains the Markdown files for the Froggit docs.
    ├── 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.