From ac313436b629cc95bd368a77e47e0f5383b7c2df Mon Sep 17 00:00:00 2001 From: Quentin Dufour Date: Thu, 9 Feb 2023 15:22:31 +0100 Subject: [PATCH] wip --- .gitignore | 1 + README.md | 197 ++++++++++++++++++++++++++++++++++++++++++++- docker-compose.yml | 38 +++++++++ teabag.env | 11 +++ 4 files changed, 245 insertions(+), 2 deletions(-) create mode 100644 .gitignore create mode 100644 docker-compose.yml create mode 100644 teabag.env diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..e649936 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +gitea diff --git a/README.md b/README.md index 735a240..1dfa62a 100644 --- a/README.md +++ b/README.md @@ -1,12 +1,205 @@ # Static Publishing Platform -based on Gitea, Teabag, Static CMS, Drone, and Garage +created at: 2023-02-09. +if you are reading this file years later, +it is very probably obsolete. + +based on: + - Gitea: https://github.com/superboum/gitea + - Teabag: https://github.com/denyskon/teabag + - Static CMS: https://www.staticcms.org/ + - Drone: https://github.com/harness/drone + - Garage: git.deuxfleurs.fr/Deuxfleurs/garage/ ## Install Gitea +The recommended docker-compose is a good start for this toy example: +https://docs.gitea.io/en-us/install-with-docker/ + +You need to configure CORS: + +```ini +[cors] +ENABLED=true +ALLOW_DOMAIN=* +ALLOW_CREDENTIALS=true +SCHEME=* +HEADERS=Content-Type,User-Agent,Authorization +``` + +The last entry is required but ignored in Gitea version < 1.19, +you must instead use a patched image to allow the custom header +`Content-Type`. For example, I am using this one: `superboum/gitea:1.17.4-cors`. + +Now you are ready to start your gitea instance: + +``` +docker-compose up -d +``` + +Now go to `http://localhost:3000` and configure your Gitea instance. +Create an administrator account by unfolding the last section. + ## Install Teabag -## Add Static CMS to your blog +The first step is to create some tokens for Teabag in Gitea. +Go to this page: http://localhost:3000/user/settings/applications +And create an Oauth2 application with the following parameters: + - name: `Teabag` + - callback: `http://localhost:3001/callback` + +Now, use the example env file from the official repo as a template. +Mine look like that: + +```ini +HOST=0.0.0.0 +PORT=3001 +SESSION_SECRET=JdNF... + +GITEA_KEY=968c9... +GITEA_SECRET=gto_65p +GITEA_BASE_URL=http://localhost:3000 +GITEA_AUTH_URI=login/oauth/authorize +GITEA_TOKEN_URI=login/oauth/access_token +GITEA_USER_URI=api/v1/user +CALLBACK_URI=http://localhost:3001/callback +``` + +This file is fetched from `./env/teabag.env` or `/etc/teabag/teabag.env`, +so pick one of this path. + +Check that teabag is running: + +``` +$ curl -I http://localhost:3001 +HTTP/1.1 200 OK +Date: Thu, 09 Feb 2023 13:32:15 GMT +Content-Length: 73 +Content-Type: text/html; charset=utf-8 +``` + +## Create a blog with Jekyll + +I don't really like CDNs so we will locally download the javasript file once and for all. +For this example, we will create a basic jekyll blog. + +``` +nix-shell -p bundler +bundler install jekyll +bundle exec jekyll new my-blog +cd my-blog +bundle install +bundle exec jekyll serve +``` + +Now you website should be available at: `http://localhost:4000`. + +You must now create a repository for your website on our target gitea instance. +Mine is `quentin/my-blog`. + +Use the gitea UI and then: + +``` +git init +git add . +git commit + +git remote add origin http://localhost:3000/quentin/my-blog.git +git push -u origin main +``` + + +## Add "Static CMS" to your blog + +In your blog folder (`my-blog`), create a file at this path `admin/index.html` with this content: + +```html + + + + + + Content Manager + + + + + + + + +``` + +And now, we must get the file `static-cms-app.js`. +We will pull it from their CDN: + +``` +wget https://unpkg.com/@staticcms/app@^1.0.0/dist/static-cms-app.js +``` + +OR + +you can also build it: + +``` +git clone git@github.com:StaticJsCMS/static-cms.git +yarn +yarn build +cp packages/app/dist/static-cms-app.js . +``` + +and finally, we need a configuration file: + +```yml +backend: + name: gitea + repo: quentin/my-blog + base_url: http://localhost:3001 + api_root: http://localhost:3000/api/v1 + branch: main + +media_folder: 'assets/' +site_url: http://my-blog.web.localhost +display_url: http://my-blog.web.localhost +locale: 'en' +collections: + - name: 'article' + label: 'Article' + folder: '_posts/' + editor: + preview: true + create: true + slug: '{{year}}-{{month}}-{{day}}-{{slug}}' + fields: + - { label: 'Layout', name: 'layout', widget: 'hidden', default: 'post' } + - { label: 'Title', name: 'title', widget: 'string' } + - { label: 'Publish Date', name: 'date', widget: 'datetime' } + - { label: 'Body', name: 'body', widget: 'markdown' } +``` + +So, your blog folder should look like that (note the admin folder and its 3 files): + +``` +$ tree +. +├── 404.html +├── about.markdown +├── admin +│   ├── config.yml +│   ├── index.html +│   └── static-cms-app.js +... +``` + +And now you are ready to test your CMS admin interface! + +``` +bundle exec jekyll serve +``` + +And then go to: http://localhost:4000/admin/ + +Click on "Login with Gitea". ## Install Drone diff --git a/docker-compose.yml b/docker-compose.yml new file mode 100644 index 0000000..a10d5dc --- /dev/null +++ b/docker-compose.yml @@ -0,0 +1,38 @@ +version: "3" + +networks: + gitea: + external: false + +services: + server: + # Patched image required for Gitea version < 1.19 + image: superboum/gitea:1.17.4-cors + container_name: gitea + environment: + - USER_UID=1000 + - USER_GID=1000 + - GITEA__cors__ENABLED =true + - GITEA__cors__ALLOW_DOMAIN =* + - GITEA__cors__ALLOW_CREDENTIALS =true + - GITEA__cors__SCHEME =* + # Ignored in Gitea version < 1.19, see image comment above + - GITEA__cors__HEADERS =Content-Type,User-Agent,Authorization + restart: always + networks: + - gitea + volumes: + - ./gitea:/data + - /etc/timezone:/etc/timezone:ro + - /etc/localtime:/etc/localtime:ro + ports: + - "3000:3000" + - "2222:22" + teabag: + image: ghcr.io/denyskon/teabag:latest + container_name: teabag + restart: always + volumes: + - ./teabag.env:/etc/teabag/teabag.env + ports: + - "3001:3001" diff --git a/teabag.env b/teabag.env new file mode 100644 index 0000000..f6e04a5 --- /dev/null +++ b/teabag.env @@ -0,0 +1,11 @@ +HOST=0.0.0.0 +PORT=3001 +SESSION_SECRET=uLCe67uvUpaI/U3c0yBzzFxJliY80BQHU/l9FZrkN38= + +GITEA_KEY=968c9d5a-8b4e-4091-b48d-cc5d0888680d +GITEA_SECRET=gto_65p4gglq5au4mtvtpq7xcnlyonfyvphlwixhhkni6aql5yd3ovcq +GITEA_BASE_URL=http://localhost:3000 +GITEA_AUTH_URI=login/oauth/authorize +GITEA_TOKEN_URI=login/oauth/access_token +GITEA_USER_URI=api/v1/user +CALLBACK_URI=http://localhost:3001/callback