Website
This website is built using Docusaurus 2, a modern static website generator.
Installation
npm install
Local Development
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
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. (
Create a new section
Follow this doc. (
Update the theme
Follow this doc. (
Components
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 -
/docs/
- Customize the order in sidebars.js. More details can be found in the docs guide -
/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
-
-
/static/
- Any contents inside here will be copied into the root of the finalbuild
directory -
/docusaurus.config.js
- This is the equivalent ofsiteConfig.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 filekermit.png
used on theabout
page atimg/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 filekermit.png
used on theslider
component atimg/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 filekermit.png
used on themanagement
documentation page atimg/docs/management/kermit.png
-
Global images (e.g: used in the footer) will be in the
img/theme/
subfolder.
License
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".
- Content outside of the above-mentioned directories or restrictions above is available under the MIT license as defined below.