Merge pull request #1 from RGBOARD/first-touches

First touches

Author: edimarvalentin

Gemfile.lock

@@ -12,9 +12,12 @@ GEM
       eventmachine (>= 0.12.9)
       http_parser.rb (~> 0)
     eventmachine (1.2.7)
+    ffi (1.17.1)
     ffi (1.17.1-arm64-darwin)
-    ffi (1.17.1-x86_64-linux-gnu)
     forwardable-extended (2.6.0)
+    google-protobuf (4.29.3-aarch64-linux)
+      bigdecimal
+      rake (>= 13)
     google-protobuf (4.29.3-arm64-darwin)
       bigdecimal
       rake (>= 13)
@@ -76,18 +79,20 @@ GEM
     rexml (3.4.0)
     rouge (4.5.1)
     safe_yaml (1.0.5)
-    sass-embedded (1.83.4-arm64-darwin)
+    sass-embedded (1.83.4)
       google-protobuf (~> 4.29)
-    sass-embedded (1.83.4-x86_64-linux-gnu)
+      rake (>= 13)
+    sass-embedded (1.83.4-arm64-darwin)
       google-protobuf (~> 4.29)
     terminal-table (3.0.2)
       unicode-display_width (>= 1.1.1, < 3)
     unicode-display_width (2.6.0)
     webrick (1.9.1)
 
 PLATFORMS
+  aarch64-linux
   arm64-darwin
-  x86_64-linux-gnu
+  x86_64-linux
 
 DEPENDENCIES
   jekyll (~> 4.4.1)

_config.yml

@@ -1,8 +1,8 @@
-title: Just the Docs Template
-description: A starter template for a Jeykll site using the Just the Docs theme!
+title: RGBoard Docs
+description: A guide on how to create RGBoards and use the provided software.
 theme: just-the-docs
 
-url: https://just-the-docs.github.io
+favicon: "/assets/images/rgb-paw.png"
+logo: "/assets/images/RGB-Icon.png"
 
-aux_links:
-  Template Repository: https://github.com/just-the-docs/just-the-docs-template
+url: https://https://rgboard.github.io/docs

assets/images/20250503_010118.jpg

@@ -0,0 +1,67 @@
+---
+title: Design
+layout: home
+nav_order: 2
+---
+<img src="assets/images/spinny.gif" alt="gif img of RGBoard">
+# Designing an RGBoard
+You can build this system however you want — and sometimes that freedom can feel like chaos. 
+The version we’re showing here uses just two panels. Why? Because that was enough for our capstone project.
+We actually considered going with a 2×2 layout, but in the end we saved money, time, and our sanity by sticking 
+with a simpler 2×1 setup.
+
+## Things to do prior to choosing parts and quantity
+- Read the READMEs in the [rpi-rgb-led-matrix](https://github.com/hzeller/rpi-rgb-led-matrix).
+If you're about to make a mistake, is likely they did first and wrote about it. For example, 
+don't get a Raspberry Pi 5 when the library states that is only supported up to the Raspberry Pi 4.
+- We got our panels from [Adafruit](https://www.adafruit.com/). Check their inventory for panels and 
+see which ones you like best for your RGBoard. Make sure is the ones with two IDC connectors in the back.
+- The 64 x 32 panels can draw up to 4 amps each! When you add them up, your power supply system has to grow in
+size and cost. 
+
+## 1. Get a Raspberry Pi compatible with rpi-rgb-led-matrix
+This computer is the central part of your computer. Get yourself a good amount of RAM
+to have enough room for your programs that make up the whole system. It also makes remote development easier when
+you do remote development with modern day tools. We recommend getting the
+Raspberry Pi 4 Model B with a generous 8GB RAM. 
+
+## 2. Determine the size of your board
+The size of your board plays a huge part in cost, power and computation. 
+### Daisy Chaining
+You'll notice these boards have arrows drawn on the back to indicate 
+how your connections should flow. The output of one panel is the input to the next
+following this direction. This allows you have a row of n panels.
+Depending on the HAT, the adapting board that goes on the Raspberry and allows GPIO connections
+to the input boards, you can set up rows on top of each other to make your canvas bigger. You can also
+make a canvas with just series connection but will to transform your image on the software side.
+### Power
+Each panel, assuming they're 64 x 32, needs around 3.8 Amps when they're fully lit up, meaning all LED's set to white.
+You can get a 5V 10A power supply for not much and that'll give you enough power for two panels and your Raspberry Pi. However, as 
+you need more, you might want to consider more serious power supplies to power your system. This is where you need to apply a little 
+electrical expertise.
+### Is there a limit to how many I can chain?
+The [rpi-rgb-led-matrix](https://github.com/hzeller/rpi-rgb-led-matrix) library supports up to 3 chains 
+with a theoretical number of 32 panels on each. That should be enough for most projects using a Raspberry Pi on 
+their design. If you are making something that requires much more than 3 x 32 panels, which would cost you thousands on the panels alone, 
+and multiple power supplies... why are you trying to run that off an $80 computer? 
+
+## 3. Get LED matrix panel(s)
+It can be one. It can be many. We recommend getting the panels from [Adafruit](https://www.adafruit.com/) but
+you can also get them from other providers as long as they come with the HUB75 connector. Please see [Panels supported](https://github.com/hzeller/rpi-rgb-led-matrix?tab=readme-ov-file#panels-supported) and
+[Types of Displays](https://github.com/hzeller/rpi-rgb-led-matrix?tab=readme-ov-file#types-of-displays) 
+for more info.
+
+## 4. Get a HAT connector
+You may be thinking: "Haha, is a HAT because it goes on top of the Raspberry like a hat". WRONG!! It stands for "Hardware Attached on Top" and is about 
+time you get professional. To make these work, you'll need 2x8 IDC ribbon cables. Your HUB75 connectors work with these but your Raspberry Pi doesn't
+have such terminal to physically connect these to. That's why you need a HAT that lets you do this. See [Adapters](https://github.com/hzeller/rpi-rgb-led-matrix/tree/master/adapter) for a selection of library
+recommendations.
+
+
+Once you get the general idea of how to put the hardware components together in a way that is thought out. Ask yourself these questions before checking out:
+- Do I have compatible panels?
+- Do I have enough power for the whole system (Panels + Raspberry Pi)?
+- Do I have a [rpi-rgb-led-matrix](https://github.com/hzeller/rpi-rgb-led-matrix) compatible Raspberry Pi? 
+- Do I have the right amount of 8 x 2 IDC Ribbon cables and are they right length? 
+
+Once you got all these components hooked up. We can move on to the next section which would be initial setup.

assets/images/RGB-Icon.png

@@ -1,35 +1,52 @@
 ---
 title: Home
 layout: home
+nav_order: 1
 ---
-
-This is a *bare-minimum* template to create a Jekyll site that uses the [Just the Docs] theme. You can easily set the created site to be published on [GitHub Pages] – the [README] file explains how to do that, along with other details.
-
-If [Jekyll] is installed on your computer, you can also build and preview the created site *locally*. This lets you test changes before committing them, and avoids waiting for GitHub Pages.[^1] And you will be able to deploy your local build to a different platform than GitHub Pages.
-
-More specifically, the created site:
-
-- uses a gem-based approach, i.e. uses a `Gemfile` and loads the `just-the-docs` gem
-- uses the [GitHub Pages / Actions workflow] to build and publish the site on GitHub Pages
-
-Other than that, you're free to customize sites that you create with this template, however you like. You can easily change the versions of `just-the-docs` and Jekyll it uses, as well as adding further plugins.
-
-[Browse our documentation][Just the Docs] to learn more about how to use this theme.
-
-To get started with creating a site, simply:
-
-1. click "[use this template]" to create a GitHub repository
-2. go to Settings > Pages > Build and deployment > Source, and select GitHub Actions
-
-If you want to maintain your docs in the `docs` directory of an existing project repo, see [Hosting your docs from an existing project repo](https://github.com/just-the-docs/just-the-docs-template/blob/main/README.md#hosting-your-docs-from-an-existing-project-repo) in the template README.
-
-----
-
-[^1]: [It can take up to 10 minutes for changes to your site to publish after you push the changes to GitHub](https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/creating-a-github-pages-site-with-jekyll#creating-your-site).
-
-[Just the Docs]: https://just-the-docs.github.io/just-the-docs/
-[GitHub Pages]: https://docs.github.com/en/pages
-[README]: https://github.com/just-the-docs/just-the-docs-template/blob/main/README.md
-[Jekyll]: https://jekyllrb.com
-[GitHub Pages / Actions workflow]: https://github.blog/changelog/2022-07-27-github-pages-custom-github-actions-workflows-beta/
-[use this template]: https://github.com/just-the-docs/just-the-docs-template/generate
+<img src="assets/images/20250503_010118.jpg" alt="img of RGBoard">
+# RGBoard Docs 🔴🟢🔵
+RGBoard is a system comprised of parts in different disciplines.
+To replicate this project, some fundamentals in different areas must be
+understood to create derivations out of the provided instructions. The
+documentation provided serves as a guide to help create RGBoards from scratch.
+## Fundamentals Prerequisites
+This is a great project for those that love tinkering and are not afraid of doing
+a little bit of everything. Let's start with the fundamentals to get started
+in building RGBoards.
+### Engineering graphics 📐✏️
+A lot of people outside of mechanical engineering think this class is a waste of
+time, but is one of the most important engineering classes and one
+of the most classical forms of engineering. Truth is, to build something, you're going to have to
+measure and sketch various iterations til you get your desired end result. Don't panic,
+you don't need to know how to create complex objects, it all depends on what kind of board
+you want to assemble, but in most cases, you will be building a frame. All you need to know is how
+to draw measured lines, do your corners and measure where to put your holes so you can bolt your frame
+to the panels.
+### Electrical engineering ⚡
+RGBoard needs power relative to its size and the correct GPIO wiring. You don't need to be an electrical engineer,
+but you need to understand that if each of your panel draws 3.8A, and you have 2 panels, then you need at minimum, a
+10A power supply.
+### Raspberry Pi 4 Model B and Unix/Linux Operating Systems 💻
+RGBoard is basically a Raspberry Pi project and this is where you will
+be spending most of your time. Raspberry Pi's will usually run on an Operating System built on Debian
+running on top of the very much popular Linux kernel. You need to understand how to use this type of
+Operating System. If all you have ever used is Windows, you have quite a journey. If you have a Mac,
+you're halfway there.
+### C++ 🐀
+What makes the lights go in RGBoard is a [library](https://github.com/hzeller/rpi-rgb-led-matrix), mostly written in C++. You need
+to know how to compile such libraries and bind them to your own project. You can wrap these executables with Python or another
+language. Did you know the unofficial mascot of C++ is a diseased rat? 
+### Python and Flask 🐍
+The back-end of RGBoard is built with Flask, a web server interface for handling client requests,
+and written in Python. Python is a relatively easy language to code in thanks to how much is able to
+abstract with its very popular and well documented libraries. You will be handling user request, authenticating
+them cryptographically with JSON Web Tokens, and making sure they have their respective CRUD permissions.
+### Web frameworks 🌐
+RGBoards front-end is built using a selected set of tools out of the rabbit hole that is web development. We use the React with JavaScript,
+Tailwind CSS to have quick styling options, and Vite to build the whole thing in a bundle that can be served with NGINX. You can make your
+own front-end if you desire or even turn RGBoard into a mobile app. In the front-end is where most people can apply their flavor.
+### Relational databases 🗃️
+In RGBoard, we use SQLite to store data due to it being so easy to interface with Python. You need to know concepts of
+Relational Databases like set theory, tables, and SQL queries and transactions.
+## Lets get started
+The first step would be to choose your sizing and power. Click [here](/design.html) to go to the design step.

assets/images/rgb-paw.png

@@ -0,0 +1,5 @@
+---
+title: Initial Setup
+layout: home
+nav_order: 3
+---