How to implement Docs-as-Code with the help of Sphinx and Codeberg Pages.
Docs-as-Code with Sphinx and Codeberg Pages #198
ka2in/Documentation:main into main Reviewed-on: ka2in/Documentation#1
Reviewed-on: ka2in/Documentation#2
Thank you for the PR. I wonder if it's a bit too specific, I have two ideas about this which are not mutually exclusive:
- create an examples section below Codeberg Pages, so all the potential examples don't clutter the sidebar for every user, but people can look at guides if they need inspiration
- split into more generic chunks
I'll elaborate on the second point:
Many things you explain here are not specific to your example. Especially the part on how to push the output of a static site generator (pick any!) into Codeberg Pages could be another section, being referenced here. I agree that it is easier to consecutively follow a guide, but I'd at least propose to split this out and end the example / guide with a "Now see this article on how to deploy the result to Codeberg Pages", and splitting that part into another file.
@ -0,0 +21,4 @@
Sphinx uses [reStructuredText](https://docutils.sourceforge.io/docs/user/rst/quickref.html) as a markup language to generate documentation content. Among further advantages, Sphinx allows you to produce your documentation in different formats, including HTML, LaTeX and ePub. You can also use one of the multiple extensions developed by the community to extend its functionality.
### <a name="setup"></a>Setting up the project
Please note that internal links should already get auto-created for headlines, you can reuse them.
Adjusted accordingly, thanks.
@ -0,0 +172,4 @@
To access the default **``index.html``** file, type **``http://localhost:8080``** in your favorite browser. You should then see the default welcome page.
[//]: # "Next chapter: Creating a new file with reStructuredText"
I suppose this is a leftover?
Yes, removed.
@ -0,0 +246,4 @@
To publish the web content of your ``deployment`` folder on Codeberg, follow the procedure described under the section [Codeberg Pages](https://docs.codeberg.org/codeberg-pages/).
You should now be able to visit your content under the following link: ``https://{user-name}.codeberg.page``.
could you drop the whitespace below?
First of all thanks a lot for your contribution that is some awesome work you have done here. But besides the comments (which is complaining at high level) I have a big critic point to add: Your article does not fit in to the index.md file of codeberg pages. Of course you are using the pages server and your article is very helpful but it does not fit into the main part of the pages docs. But I would still like to include it in the documentation, therefore I would suggest to create a new section within the pages section.
We had some discussions about that and we thought about a structure like this:
├── docs
│ └── content
│ └── codeberg-pages
│ ├── examples
│ │ ├── a-example
│ │ ├── another-example
│ │ └── docs-as-code
│ │ └── index.md
│ ├── index.md
│ └── troubleshooting.md
This is much cleaner than your current approach and we could also add more articles like yours :). Also the main page of codeberg-pages would not be so overwhelming and full for newcomers.
If you could move you additions to a new section we would be happy to include them in our documentation. Thanks again for your contribution
@ -0,0 +3,4 @@
key: CodebergPagesDocsAsCode
title: Pushing output from static site generators
parent: CodebergPages
author: Fayçal Alami Hassani - GlobalTech Translations - https://globaltech-translations.com
I am not quite sure if your website really makes sense here. Of course you wrote this article and you should be honored but I think your name and email adress (if you want) or your codeberg profile url would make more sense here
Adjusted accrodingly.
@ -0,0 +7,4 @@
date: January 2022
draft: true
---
I think a toc would be really great. Not sure whether there are auto-generated ones yet
I don't know, either. Should explore this later.
@ -0,0 +23,4 @@
To copy the content of the ``html`` folder to your new ``deployment`` folder, run the command:
```bash
(.venv) $ cp -R docs/build/html/ deployment
there is an extra whitespace before deployment
"deployment" is the target folder. You're copying the content from docs/build/html/ into a new folder named "deployment".
@ -0,0 +24,4 @@
```bash
(.venv) $ cp -R docs/build/html/ deployment
```
Please make sure to stick to the markdown formatting rules. This lines should look like this:
To copy the content of the html folder to your new deployment folder, run the command:
```bash
(.venv) $ cp -R docs/build/html/ deployment
```
We will now initialize an empty repository inside the deployment folder. To do so, type the command:
Notice the empty line before We will now...
Done.
@ -0,0 +28,4 @@
We will now initialize an empty repository inside the deployment folder. To do so, type the command:
```bash
$ git init
I did not really understand the setup. I think you ment:
├── sources --> This is a git repo
│ ├── build
│ │ └── html
│ │ └── deployment --> This is a separate git repo
│ └── content
If thats the case I would suggest creating a submodule. Correct my if I am wrong though. But still this architecture with a submodule would probably make more sense than having separate folders/repos.
You're right. Creating a submodule is the way to go. Somehow, I had some issues upon creating a submodule, and then decided to have separate folders/repos.
I will add a corresponding note and suggest creating a submodule.
@ -0,0 +55,4 @@
$ git push origin HEAD:your-remote-branch-name
```
> **Note:**<br />Replace ``your-remote-branch-name`` by the actual name of your remote branch. It is recommended to intially push your commits to a different branch than the ``master`` or ``main`` branch. Once you have made sure everything went smoothly, you can then make a pull request to merge contents.
you can then make a pull request to merge contents.
Many people might not know what a PR is so why not link to the PR documentation of codeberg: https://docs.codeberg.org/collaborating/pull-requests-and-git-flow/
Done.
@ -56,0 +56,4 @@
## Docs-as-Code with Sphinx and Codeberg Pages
Docs-as-Code (also known as “Documentation as Code”) refers to the concept of treating documentation as a codebase, i.e. integrating the documentation process in the toolchains and workflows used by software development teams.
Maybe add a note at the end: For further information about Docs-as-Code head over to their official website: https://docs-as-co.de/ or something like that.
Note added.
@ -56,0 +62,4 @@
Whether you are a single technical communicator or a member of a larger documentation team, you can perfectly apply the Docs-as-Code approach to your documentation projects.
This guide will show you how to implement Docs-as-Code on a Linux machine using [“Sphinx”](https://www.sphinx-doc.org/en/master/) as a documentation generator, [“Git”](https://ka2in.codeberg.page/gitinminutes.html) as a version control system and [“Codeberg Pages”](https://docs.codeberg.org/codeberg-pages/) as a static website hoster.
Well your example with Sphinx is pretty good but you could at a note there that this could also easily applied to any other static site generatior such as eleventy or hugo etc.
Done.
@ -56,0 +83,4 @@
A ”virtual“ isolated environment comes in very handy to eliminate the risk of any broken dependencies while working on your projects. Put in other words, setting up a virual environment for your project allows you to run an instance of the Python interpreter with a particular package set and a specific configuration while ensuring compatibility between all these components inside that environment.
Before proceeding with this task, you should make sure that you have ”pip“ and ”python“ installed on your machine. To perform a preliminary check, type the following commands in your terminal:
```bash
Please add an emty line before the code block
Empty line added.
@ -56,0 +92,4 @@
Depending on your Python version, you will need to install a compatible virtual environment manager, i.e. either ”venv“ for Python >= 3.3 , or ”virtualenv“ for older Python versions.
> **Note**<br /> Please note that Python2 has reached its EOL (End of Life) on January 1st 2020, which means that it is no longer receiving any security updates. If you are using Python 3.3 or higher, you do not need to install the ”venv“ module, since it is already available in your Python standard library.
Is there a reason for the whitespace after the <br />
No. Whitespace removed.
@ -56,0 +94,4 @@
> **Note**<br /> Please note that Python2 has reached its EOL (End of Life) on January 1st 2020, which means that it is no longer receiving any security updates. If you are using Python 3.3 or higher, you do not need to install the ”venv“ module, since it is already available in your Python standard library.
To install ”virtualenv“ for older Python versions, type the following command in your terminal:
You already said that Python2 has reached its EOL. Why should we continiue documenting Python2 specific stuff
No, we should not. But people use outdated software on some occasions, and the purpose of user-friendly documentation is to help people regardless of their technical background or level of expertise.
@ -56,0 +107,4 @@
$ python3 -m venv env
```
If you are using Python2, run the following commands instead:
Same as the above with Python2
Adjusted accordingly.
@ -56,0 +132,4 @@
$ which python
```
The output of the command above should be the **``env``** folder.
You could add an example output there:
./env/bin/python
Example added.
@ -56,0 +142,4 @@
### 4. Installing Sphinx in your virtual environment
If you have followed the steps described up to this point, your local repository should now contain your virtual environment's folder **```env```** in addition to the hidden **```.git```** directory and the **```.gitignore```** file that we have already described at the end of the section [Creating a Python virtual environment](#creating-a-python-virtual-environment).
You could at the output of the tree command there
├── myproject
│ ├── env
│ ├── .git
│ └── .gitignore
Done.
@ -56,0 +144,4 @@
If you have followed the steps described up to this point, your local repository should now contain your virtual environment's folder **```env```** in addition to the hidden **```.git```** directory and the **```.gitignore```** file that we have already described at the end of the section [Creating a Python virtual environment](#creating-a-python-virtual-environment).
<a name="mydocs"></a>
As @fnetX already mentioned you can use the header links (e.g. http://localhost:8080/codeberg-pages/#1.-setting-up-the-project)
This is in the middle of a section, right? Makes sense to add a custom link there if really necessary.
@ -56,0 +162,4 @@
└── .gitignore
```
With your virtual environment activated as shown above, it is now time to install Sphinx with the ```pip``` tool. To do so, run the command:
Sometimes you are using one backtick ` inline, sometimes two backticks `` and now I see even three backticks ```. I am not quite sure if there is a difference but if not please use a single backtick ` inline and three backticks ``` for code blocks
Done.
@ -56,0 +199,4 @@
To set up a local testing server for your documentation project, you can use the Python module **``http.server``**. To do so, you will first have to build the html resources for the initial test by running the command:
<a name="build"></a>
Same as the above: Use the generated header links
Done.
Also since youve done a lot of commits, it would make sense to squash them together, if the PR is not doing it by default.
If you need help with squashing feel free to ask for help
There is a squash option during merging, the merging person needs to remember to do it.
There is a squash option during merging, the merging person needs to remember to do it.
Alright I already assigned myself so I will do that
But I would still like to include it in the documentation, therefore I would suggest to create a new section within the pages section.
We had some discussions about that and we thought about a structure like this:
├── docs │ └── content │ └── codeberg-pages │ ├── examples │ │ ├── a-example │ │ ├── another-example │ │ └── docs-as-code │ │ └── index.md │ ├── index.md │ └── troubleshooting.md
It isn't possible to create sub-categories in the docs yet. That would probably need some template and UI changes. Though it would be nice to have.
@ka2in for now you could create an examples.md with a brief description, then put the entire docs-as-code article (including the additions to index.md) under a sub-heading.
But I would still like to include it in the documentation, therefore I would suggest to create a new section within the pages section.
We had some discussions about that and we thought about a structure like this:
├── docs │ └── content │ └── codeberg-pages │ ├── examples │ │ ├── a-example │ │ ├── another-example │ │ └── docs-as-code │ │ └── index.md │ ├── index.md │ └── troubleshooting.mdIt isn't possible to create sub-categories in the docs yet. That would probably need some template and UI changes. Though it would be nice to have.
@ka2in for now you could create an examples.md with a brief description, then put the entire docs-as-code article (including the additions to index.md) under a sub-heading.
@n Thank you! I followed the initial advice of @fnetX and created a new, separate section right after the section "Codeberg Pages".
@ -0,0 +1,9 @@
---
eleventyNavigation:
key: Examples
title: Examples
This is of course a workaround until we manage to implement sub-categories but still it is unclear that this section is related to the pages section
├── Codeberg Pages
│ └── Troubleshooting
└── Examples
├── Docs as Code
└── Pushing output from SSGs into Codeberg Pages
This is what it looks like on the web view.
Maybe rename the section to Codeberg Pages - Examples, or something like that, for now
The "Pushing output" ... better fits below Codeberg Pages below. Also, I don't like the new Section approach, can we keep this structure for filenames (URLs + on disk tree, future proof / avoid renames in the future)
─── Codeberg Pages
├── Troubleshooting
├── Pushing output from SSGs into Codeberg Pages
└── Examples
└── Docs as Code with Spinx
But this for the sidebar (using the eleventy parent tools that don't have to be equal to how it's structured on the disk)
─── Codeberg Pages
├── Troubleshooting
├── Pushing output from SSGs into Codeberg Pages
└── Example: Docs as Code with Spinx
I don't mind whether the generic instruction of how to push SSG output to pages resides under Examples or Codeberg Pages directly.
It makes more sense to keep the example with Sphinx above the article about pushing output into Codeberg Pages. You first test on your local environment, and once you're satisfied with the result, you push the output into Codeberg Pages.
I tend to disagree. Pushing output to Codeberg Pages is relevant for much more people than the specific example about Spinx. Also, these steps can be learned independently (While I get that your tutorial like initial writeup is kind-of separated now, you can learn how to push something to pages first, then consider if you like it, and then consider if you want this specific example).
But I won't block this with an inverted order if you insist.
Order inverted.
The initial intention was to introduce the user to the concept of "Docs-as-Code". Consequently, the user tests something on the local environment, then pushes the output into Codeberg Pages.
Your articles are now missing entirely, arent they? @ka2in
@schorsch
This is what "git status" gives me in my active directory:
On branch main
Your branch is up to date with 'origin/main'.
nothing to commit, working tree clean
Im so sorry I was on the wrong branch
Everything is fine now
@schorsch Thank you for merging the commits in the upstream repo. I've noticed that the content is still offline. Is this a normal behavior at this point of the process?
@ka2in Thank you for your submission and being patient during review. I'll deploy the changes shortly.
No dependencies set.
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?