Skip to content

Commit 74c60d3

Browse files
joerdava-h
andauthored
feat: add docusaurus (#69)
* feat: embed logo font in svg * feat: initial website * feat: initial website * feat: update build task * feat: docs workflow * feat: create docs * feat: update styling * chore: add docusarus as a dev dep --------- Co-authored-by: Adrian Hesketh <[email protected]>
1 parent cd9acc3 commit 74c60d3

31 files changed

+40245
-2
lines changed

.github/workflows/docs.yaml

+62
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
name: Deploy Docs
2+
3+
on:
4+
push:
5+
branches:
6+
- main
7+
paths:
8+
- "docs/**"
9+
workflow_dispatch:
10+
11+
permissions:
12+
contents: read
13+
pages: write
14+
id-token: write
15+
16+
concurrency:
17+
group: "pages"
18+
cancel-in-progress: false
19+
20+
defaults:
21+
run:
22+
shell: bash
23+
24+
jobs:
25+
build-docs:
26+
runs-on: ubuntu-latest
27+
steps:
28+
- name: Checkout
29+
uses: actions/checkout@v3
30+
with:
31+
submodules: recursive
32+
fetch-depth: 0
33+
- name: Setup Pages
34+
id: pages
35+
uses: actions/configure-pages@v3
36+
- uses: actions/setup-node@v3
37+
with:
38+
node-version: '16'
39+
cache: npm
40+
- name: Install Node.js dependencies
41+
run: |
42+
cd docs
43+
npm ci
44+
- name: Build with Hugo
45+
run: |
46+
cd docs
47+
npm run build
48+
- name: Upload artifact
49+
uses: actions/upload-pages-artifact@v1
50+
with:
51+
path: ./docs/build
52+
53+
deploy-docs:
54+
environment:
55+
name: github-pages
56+
url: ${{ steps.deployment.outputs.page_url }}
57+
runs-on: ubuntu-latest
58+
needs: build-docs
59+
steps:
60+
- name: Deploy to GitHub Pages
61+
id: deployment
62+
uses: actions/deploy-pages@v2

.gitignore

+3
Original file line numberDiff line numberDiff line change
@@ -5,3 +5,6 @@ cmd/templ/lspcmd/*log.txt
55
.DS_Store
66
coverage.out
77
coverage
8+
docs/build/
9+
docs/resources/_gen/
10+
node_modules/

README.md

+21-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
![templ](templ.png)
1+
![templ](https://github.com/a-h/templ/raw/main/templ.png)
22

33
## A HTML templating language for Go that has great developer tooling.
44

@@ -715,6 +715,26 @@ if [ "${GITHUB_TOKEN}" == "" ]; then echo "No github token, run:"; echo "export
715715
goreleaser --clean
716716
```
717717
718+
### docs-run
719+
720+
Run the development server.
721+
722+
Directory: docs
723+
724+
```
725+
npm run start
726+
```
727+
728+
### docs-build
729+
730+
Build production docs site.
731+
732+
Directory: docs
733+
734+
```
735+
npm run build
736+
```
737+
718738
# Code signing
719739
720740
The binaries are created by me and signed by my GPG key. You can verify with my key https://adrianhesketh.com/a-h.gpg

docs/.gitignore

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
# Dependencies
2+
/node_modules
3+
4+
# Production
5+
/build
6+
7+
# Generated files
8+
.docusaurus
9+
.cache-loader
10+
11+
# Misc
12+
.DS_Store
13+
.env.local
14+
.env.development.local
15+
.env.test.local
16+
.env.production.local
17+
18+
npm-debug.log*
19+
yarn-debug.log*
20+
yarn-error.log*

docs/README.md

+41
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
# Website
2+
3+
This website is built using [Docusaurus 2](https://docusaurus.io/), a modern static website generator.
4+
5+
### Installation
6+
7+
```
8+
$ yarn
9+
```
10+
11+
### Local Development
12+
13+
```
14+
$ yarn start
15+
```
16+
17+
This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server.
18+
19+
### Build
20+
21+
```
22+
$ yarn build
23+
```
24+
25+
This command generates static content into the `build` directory and can be served using any static contents hosting service.
26+
27+
### Deployment
28+
29+
Using SSH:
30+
31+
```
32+
$ USE_SSH=true yarn deploy
33+
```
34+
35+
Not using SSH:
36+
37+
```
38+
$ GIT_USER=<Your GitHub username> yarn deploy
39+
```
40+
41+
If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch.

docs/babel.config.js

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
module.exports = {
2+
presets: [require.resolve('@docusaurus/core/lib/babel/preset')],
3+
};
+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"position": 2,
3+
"label": "Getting Started",
4+
"collapsible": true,
5+
"collapsed": true,
6+
"className": "red",
7+
"link": {
8+
"type": "generated-index",
9+
"title": "Getting Started"
10+
}
11+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
# Installing templ
2+
3+
`todo`
4+
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
# Setting up your project
2+
3+
`todo`

docs/docs/index.md

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
---
2+
sidebar_position: 1
3+
---
4+
5+
# Introduction
6+
7+
## Overview of templ
8+
9+
`todo`
10+
11+
## Features and benefits
12+
13+
`todo`
14+
15+
```html
16+
templ PersonTemplate(p Person) {
17+
<div>
18+
for _, v := range p.Addresses {
19+
{! AddressTemplate(v) }
20+
}
21+
</div>
22+
}
23+
```
24+
25+
```go
26+
templ PersonTemplate(p Person) {
27+
<div>
28+
for _, v := range p.Addresses {
29+
{! AddressTemplate(v) }
30+
}
31+
</div>
32+
}
33+
```
+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"position": 3,
3+
"label": "Syntax and Usage",
4+
"collapsible": true,
5+
"collapsed": true,
6+
"className": "red",
7+
"link": {
8+
"type": "generated-index",
9+
"title": "Syntax and Usage"
10+
}
11+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
sidebar_position: 1
3+
---
4+
5+
# Basic syntax
6+
7+
`todo`
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
sidebar_position: 3
3+
---
4+
5+
# Conditional attributes
6+
7+
`todo`
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
sidebar_position: 2
3+
---
4+
5+
# Expressions
6+
7+
`todo`

docs/docs/syntax-and-usage/loops.md

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
sidebar_position: 4
3+
---
4+
5+
# Loops
6+
7+
`todo`

docs/docs/syntax-and-usage/styles

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
sidebar_position: 6
3+
---
4+
5+
# CSS style management
6+
7+
`todo`
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
sidebar_position: 5
3+
---
4+
5+
# Template composition
6+
7+
`todo`

docs/docusaurus.config.js

+106
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
// @ts-check
2+
// Note: type annotations allow type checking and IDEs autocompletion
3+
4+
const lightCodeTheme = require('prism-react-renderer/themes/github');
5+
const darkCodeTheme = require('prism-react-renderer/themes/dracula');
6+
7+
/** @type {import('@docusaurus/types').Config} */
8+
const config = {
9+
title: 'templ docs',
10+
tagline: 'A language for writing HTML user interfaces in Go. ',
11+
favicon: 'img/favicon.ico',
12+
13+
// Set the production url of your site here
14+
url: 'https://templ.guide',
15+
// Set the /<baseUrl>/ pathname under which your site is served
16+
// For GitHub pages deployment, it is often '/<projectName>/'
17+
baseUrl: '/',
18+
19+
// GitHub pages deployment config.
20+
// If you aren't using GitHub pages, you don't need these.
21+
organizationName: 'a-h', // Usually your GitHub org/user name.
22+
projectName: 'templ', // Usually your repo name.
23+
24+
onBrokenLinks: 'throw',
25+
onBrokenMarkdownLinks: 'warn',
26+
27+
// Even if you don't use internalization, you can use this field to set useful
28+
// metadata like html lang. For example, if your site is Chinese, you may want
29+
// to replace "en" with "zh-Hans".
30+
i18n: {
31+
defaultLocale: 'en',
32+
locales: ['en'],
33+
},
34+
35+
presets: [
36+
[
37+
'classic',
38+
/** @type {import('@docusaurus/preset-classic').Options} */
39+
({
40+
docs: {
41+
sidebarPath: require.resolve('./sidebars.js'),
42+
routeBasePath: '/',
43+
// Please change this to your repo.
44+
// Remove this to remove the "edit this page" links.
45+
editUrl:
46+
'https://github.com/a-h/templ/tree/main/docs/',
47+
},
48+
blog: false,
49+
theme: {
50+
customCss: require.resolve('./src/css/custom.css'),
51+
},
52+
}),
53+
],
54+
],
55+
56+
themeConfig:
57+
/** @type {import('@docusaurus/preset-classic').ThemeConfig} */
58+
({
59+
// Replace with your project's social card
60+
image: 'img/docusaurus-social-card.jpg',
61+
navbar: {
62+
logo: {
63+
alt: 'Templ Logo',
64+
src: 'img/logo.svg',
65+
},
66+
items: [
67+
{
68+
type: 'docSidebar',
69+
sidebarId: 'tutorialSidebar',
70+
position: 'left',
71+
label: 'Docs',
72+
},
73+
{
74+
href: 'https://github.com/a-h/templ',
75+
label: 'GitHub',
76+
position: 'right',
77+
},
78+
],
79+
},
80+
footer: {
81+
style: 'dark',
82+
links: [
83+
{
84+
title: 'Docs',
85+
items: [
86+
{
87+
label: 'Introduction',
88+
to: '/',
89+
},
90+
{
91+
label: 'Getting Started',
92+
to: '/category/getting-started',
93+
},
94+
],
95+
},
96+
],
97+
copyright: `Copyright © ${new Date().getFullYear()} Adrian Hesketh, Built with Docusaurus.`,
98+
},
99+
prism: {
100+
theme: lightCodeTheme,
101+
darkTheme: darkCodeTheme,
102+
},
103+
}),
104+
};
105+
106+
module.exports = config;

0 commit comments

Comments
 (0)