The Roads
The Roads 
A free road map template that was created with Svelte & Svelte Kit & Tailwind CSS & Remixicon that you can use for your projects.
We are very pleased to share another free template with the community. We hope The Roads template will help anyone who needs a road map for their projects.
You can customize this template as you wish by copying it to your own repository and pulling it to your local.
Headless CMS
To manage the content of this template, we recommend you use Contentrain.
We have created the collection template that you need. You can find and use this collection in “Community Collections”.
After free registration with Contentrain, you need to start a manual project installation and continue the installation by selecting the Rain of Change repo on Github.
During the installation, it is enough to delete the sample collections in the Collections step, select the Logs collection from the Community Collections section and complete the installation.
This way you can easily manage all your content with Contentrain.
If you have any questions about the installation, you can send us your questions via Discord.
Frontmatter
Roads Default
| variable | description | options |
|---|---|---|
| title | Timeline title | String |
| description | Timeline description | String |
| slug | MD file name | String |
| icon | The icon on the card | String Icons |
| progress | The progress state | Boolean |
| date | Starting date | String |
| type | Timeline type | String |
| content | Timeline card content | String |
Roads author Object
| variable | description | options |
|---|---|---|
| name | Author name | String |
| image | Author image | String |
| title | Author job description | String |
Header default
| variable | description | options |
|---|---|---|
| logo | Project logo | string |
Header links object
| variable | description | options |
|---|---|---|
| icon | Social media icon | String Icons |
| link | Social media url | Url |
Setup
Make sure to install the dependencies:
# yarn
yarn install
# npm
npm install
Development Server
Start the development server on http://localhost:5173
npm run dev
Deployment
Static Hosting
Pre-render the website to be deployed on any static hosting:
npm run build
The build/ directory is ready to be deployed, learn more on Svelte docs.
Node server
Build the application for production:
npm run build
Start the server in production:
node output/server/index.js
Learn more on Svelte kit docs for more information.
