DEV Community

Cover image for [Open Source]: Noob Docs - The Simple Docs
Muhammad
Muhammad

Posted on

[Open Source]: Noob Docs - The Simple Docs

What is Noob Docs?

Noob Docs is a complete Git Powered Documentation System meaning it is a place where all documentations that have ever seemed make no sense become a documentation that makes sense. It is a repository for simplifying documentations and guides.

How does it work?

Noob Doc Concept

All tutorials and guides are hosted on a github repo. The website itself is hosted on github pages. Noob Docs uses Markdown as the standard for writing and publishing articles. The articles follow a simple folder based hierarchy, just like in the back of the old times where all were organized in folders. Anyone can can fork the repo and add changes to it which can later be merged into the repo. As soon as the changes are merged, Noob Docs automatically fetches them and makes them avaialble for the web. These tutorials are also available to read by just browsing the repo itself too.

The Directory Structure?

You can find the repo at: https://github.com/th3n00bc0d3r/noobdocs

Guides/ ## Directory for Uploading and Structuing the Guides
Test/ ## This is just a test Directory
docs/ ## The Compiled Script for the Website
.gitignore ## Ignores Folders/Files you do not want to upload
CNAME ## Used for redirecting to Domain Web Address
README.md ## This is the Home Page
Enter fullscreen mode Exit fullscreen mode

Now If you look at: noobdocs/Guides/Databases/MySQL/Understanding Databases (Relational)/

noobdocs/Guides/Databases/MySQL/Understanding Databases (Relational)/

1. Guides is the Main Folder
2. Databases is a Category Folder
3. MySQL is a Sub-Category Folder
4. Understanding Databases (Relational) is the Article Folder
Enter fullscreen mode Exit fullscreen mode

The Article Directory

Article

links.md - This is the table of contents of your article
readme.md - This is the article itself
Enter fullscreen mode Exit fullscreen mode

links.md

[Introduction](#introduction)
[Features](#features)
[Primary Key](#primarykey) - 1
[Not Null](#notnull)
[Auto Increment](#autoincrement)
[CRUD](#crud)
[Excercise 1](#excercise1)
Enter fullscreen mode Exit fullscreen mode

When making links.md, please be sure the #link in this case 1 is all lowercase and without any spaces or the side table of contents will not work on the website

readme.md

#### Primary Key
It is a feature of a relational database, that sets to a column making sure that whatever value it contains is always unique. If no value is ever tried to insert into it, it will not allow the entry to be made.

#### Not Null
Simple, it has to have a value or do not allow any entry to enter into it. i. e. NN, Not Null, or Null
Enter fullscreen mode Exit fullscreen mode

As you can see it is very simple to link headings with the table of contents of your article.

Summary of Contribution

  1. Fork it
  2. Create Folder in noobdocs/Guides/Category/SubCategory/ArticleName
  3. Create your Article branch (git checkout -b my-new-feature)
  4. Commit your changes (git commit -am 'Add some feature')
  5. Push to the branch (git push origin my-new-feature)
  6. Create new Pull Request

Noob Docs Source

  Preview

The frontend that is the website is made using Angular 8. Please follow the following guide to set it up locally.

git clone https://github.com/th3n00bc0d3r/noobdocs.git
cd source
npm i
ng serve
Enter fullscreen mode Exit fullscreen mode

You need to have the following for it to run;

I highly recommend Visual Studio Code, you can use any editor of your choice.

The Source Structure

source/src/app

Source Structure

The whole application because of Angular is a module based application.

layout ## The Layout Module, think of it as a wrapper
-- frame ## This is where the content is loaded
-- header ## The Navigation of the Website
pages 
 -- article ## The Component for where your article is rendered
 -- categories ## Listing for Folders from Github
 -- home ## This is the Homepage where Readme.md is rendered
 -- wip ## Just a 404 Page not Found
services ## API List for communication
Enter fullscreen mode Exit fullscreen mode

GitHub logo th3n00bc0d3r / noobdocs

A project to create an online doc system from github

What is Noob Docs?

Noob Docs is a complete Git Powered Documentation System meaning it is a place where all documentations that have ever seemed make no sense become a documentation that makes sense. It is a repository for simplifying documentations and guides.

How does it work?

Noob Doc Concept

All tutorials and guides are hosted on a github repo. The website itself is hosted on github pages. Noob Docs uses Markdown as the standard for writing and publishing articles. The articles follow a simple folder based hierarchy, just like in the back of the old times where all were organized in folders. Anyone can can fork the repo and add changes to it which can later be merged into the repo. As soon as the changes are merged, Noob Docs automatically fetches them and makes them avaialble for the web. These tutorials are also available to read by just browsing the repo…

Top comments (0)