added a 'knowledge base'

17 files changed, 175 insertions, 0 deletions

diff --git a/content/docs/resources-to-learn-programming/web-development/_index.md b/content/docs/resources-to-learn-programming/web-development/_index.md
new file mode 100644
index 0000000..863b749
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/_index.md
@@ -0,0 +1,4 @@
+---
+title: Web Development
+description: From HTML/CSS to React/Nodejs
+---
diff --git a/content/docs/resources-to-learn-programming/web-development/backend/_index.md b/content/docs/resources-to-learn-programming/web-development/backend/_index.md
new file mode 100644
index 0000000..5c5ff34
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/backend/_index.md
@@ -0,0 +1,6 @@
+---
+title: Backend
+description: Backend Web Development
+weight: 2
+---
+
diff --git a/content/docs/resources-to-learn-programming/web-development/backend/http-frameworks/_index.md b/content/docs/resources-to-learn-programming/web-development/backend/http-frameworks/_index.md
new file mode 100644
index 0000000..0c942bb
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/backend/http-frameworks/_index.md
@@ -0,0 +1,7 @@
+---
+title: HTTP Frameworks
+description: Web frameworks to build APIs
+weight: 1
+---
+
+A web framework is helpful for creating REST APIs. Some frameworks even handle templating, logging, etc by themselves.
diff --git a/content/docs/resources-to-learn-programming/web-development/backend/http-frameworks/express.md b/content/docs/resources-to-learn-programming/web-development/backend/http-frameworks/express.md
new file mode 100644
index 0000000..a18a657
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/backend/http-frameworks/express.md
@@ -0,0 +1,9 @@
+---
+title: Express
+description: Minimalist web framework for Node.js
+weight: 2
+---
+
+Express is one of the most popular web frameworks for node. It's very easy to use and doesn't require much boilerplate code.
+
+- Express in one video: [Video by Web Dev Simplified](https://www.youtube.com/watch?v=SccSCuHhOw0)
diff --git a/content/docs/resources-to-learn-programming/web-development/backend/http-frameworks/gin.md b/content/docs/resources-to-learn-programming/web-development/backend/http-frameworks/gin.md
new file mode 100644
index 0000000..fe13678
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/backend/http-frameworks/gin.md
@@ -0,0 +1,9 @@
+---
+title: Gin
+description: My favourite web framework for GoLang
+weight: 1
+---
+
+Go is my favourite programming language, and whenever I want to write a web server in Go, [Gin](https://github.com/gin-gonic/gin) is what I use!
+
+- Gin Documentation: [Official Documentation](https://github.com/gin-gonic/gin#README)
diff --git a/content/docs/resources-to-learn-programming/web-development/backend/orms/_index.md b/content/docs/resources-to-learn-programming/web-development/backend/orms/_index.md
new file mode 100644
index 0000000..6277f85
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/backend/orms/_index.md
@@ -0,0 +1,8 @@
+---
+title: Object Relational Mapping (ORM)
+description: Makes it easy to work with databases
+weight: 3
+---
+
+An ORM lets you use an object oriented paradigm to query databases. It's great because it cleans up a lot of your code, and you don't need to be good at SQL to use it.
+ORM libraries save you a lot of time because they do most of the heavylifting themselves.
diff --git a/content/docs/resources-to-learn-programming/web-development/backend/orms/sequelize.md b/content/docs/resources-to-learn-programming/web-development/backend/orms/sequelize.md
new file mode 100644
index 0000000..74fbb1d
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/backend/orms/sequelize.md
@@ -0,0 +1,11 @@
+---
+title: Sequelize
+description: One of the most popular ORMs for Node.js
+weight: 1
+---
+
+Sequelize is a very easy to use ORM for use with NodeJS and it supports multiple database types.
+I love sequelize because I don't like writing SQL. One downside to it is that directly running SQL commands is actually much faster.
+
+- Sequelize Tutorial: [Video by PedroTech](https://www.youtube.com/watch?v=Crk_5Xy8GMA)
+- Sequelize Documentation: [Official Documentation](https://sequelize.org/docs/v6/getting-started/)
diff --git a/content/docs/resources-to-learn-programming/web-development/backend/template-engines/_index.md b/content/docs/resources-to-learn-programming/web-development/backend/template-engines/_index.md
new file mode 100644
index 0000000..4b320db
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/backend/template-engines/_index.md
@@ -0,0 +1,8 @@
+---
+title: Template Engines
+description: Used to build server-side rendered websites
+weight: 2
+---
+
+A template engine lets you define HTML templates for your web application and populates the dynamic data on runtime.
+It's good for websites where most of the content remains static. For example, blogs, etc
diff --git a/content/docs/resources-to-learn-programming/web-development/backend/template-engines/ejs.md b/content/docs/resources-to-learn-programming/web-development/backend/template-engines/ejs.md
new file mode 100644
index 0000000..5172791
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/backend/template-engines/ejs.md
@@ -0,0 +1,9 @@
+---
+title: ejs
+description: Template engine for Node.js
+weight: 2
+---
+
+ejs is a very easy to use and flexible template engine for Node.js. I love it because you can start writing ejs within minutes!
+
+- Building a blog with ejs: [Video by Web Dev Simplified](https://www.youtube.com/watch?v=1NrHkjlWVhM)
diff --git a/content/docs/resources-to-learn-programming/web-development/backend/template-engines/gin.md b/content/docs/resources-to-learn-programming/web-development/backend/template-engines/gin.md
new file mode 100644
index 0000000..7ed28c5
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/backend/template-engines/gin.md
@@ -0,0 +1,11 @@
+---
+title: Gin
+description: Gin framework for GoLang has a template engine
+weight: 1
+---
+
+The Gin HTTP framework comes with a template engine that is very easy to use.
+
+- Documentation: [Official Documentation](https://gin-gonic.com/docs/examples/html-rendering/)
+
+You can checkout my dropped project (sadly) which is a blog website that is rendered with Gin: <https://github.com/MikunoNaka/vidhublog>
diff --git a/content/docs/resources-to-learn-programming/web-development/frontend/_index.md b/content/docs/resources-to-learn-programming/web-development/frontend/_index.md
new file mode 100644
index 0000000..aad43f1
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/frontend/_index.md
@@ -0,0 +1,18 @@
+---
+title: Frontend
+description: Frontend Web Development
+weight: 1
+---
+
+
+## General resources (have multiple tutorials)
+
+- [Web Dev Simplified](https://www.youtube.com/channel/UCFbNIlppjAuEX4znoulh0Cw):
+Best YouTube channel to learn web development.
+- [W3Schools](https://www.w3schools.com/):
+Best website containing very useful HTML/CSS/JS tutorials.
+
+
+## Resources based on web technology
+
+I recommend learning all these technologies in the same order as they are listed.
diff --git a/content/docs/resources-to-learn-programming/web-development/frontend/html-css/_index.md b/content/docs/resources-to-learn-programming/web-development/frontend/html-css/_index.md
new file mode 100644
index 0000000..dc67f53
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/frontend/html-css/_index.md
@@ -0,0 +1,20 @@
+---
+title: HTML/CSS
+description: The very basics of web frontend
+weight: 1
+---
+
+HTML (HyperText Markup Language) and CSS (Cascading StyleSheets) are two of the core technologies
+you must learn to make websites. These two are **very** easy to learn but without these web development is totally useless.
+
+- HTML in one video: [Video by Mike Dane](https://www.youtube.com/watch?v=pQN-pnXPaVg)
+- Textual Tutorial: [W3Schools](https://www.w3schools.com/html/default.asp)
+- CSS in one video: [Video by Web Dev Simplified](https://www.youtube.com/watch?v=1PnVor36_40)
+- CSS Documentation: [W3Schools](https://www.w3schools.com/css/default.asp)
+- Simple HTTP fileserver to host HTML files: [GoFileServer](https://github.com/MikunoNaka/GoFileServer/releases/latest)
+
+## Fun trick
+
+You can use GoFileServer [GoFileServer](https://github.com/MikunoNaka/GoFileServer/releases/latest)
+to host the HTML files over the network, and then you can enter the URL of the server on another pc/phone on 
+the same WiFi network to open the website on that device.
diff --git a/content/docs/resources-to-learn-programming/web-development/frontend/js-frameworks/_index.md b/content/docs/resources-to-learn-programming/web-development/frontend/js-frameworks/_index.md
new file mode 100644
index 0000000..d7c9637
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/frontend/js-frameworks/_index.md
@@ -0,0 +1,8 @@
+---
+title: JavaScript Frameworks
+description: Componentize your web applications
+weight: 3
+---
+
+JS frameworks make it easy to write websites which make heavy use of JavaScript for logic.
+You can divide different parts of the website into "components" that can be imported and used/re-used multiple times in the website without the need to write extra code.
diff --git a/content/docs/resources-to-learn-programming/web-development/frontend/js-frameworks/react.md b/content/docs/resources-to-learn-programming/web-development/frontend/js-frameworks/react.md
new file mode 100644
index 0000000..c20844f
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/frontend/js-frameworks/react.md
@@ -0,0 +1,10 @@
+---
+title: React
+description: The most popular JavaScript UI library
+weight: 1
+---
+
+React is my favourite JS Framework (by definition it's a library but I'm grouping it with framework). 
+It's very easy to learn and is very popular so has great documentation.
+
+- React in one video: [Video by Mike Dane](https://www.youtube.com/watch?v=ABQLwlE8MUA)
diff --git a/content/docs/resources-to-learn-programming/web-development/frontend/js-frameworks/svelte.md b/content/docs/resources-to-learn-programming/web-development/frontend/js-frameworks/svelte.md
new file mode 100644
index 0000000..3dd4e61
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/frontend/js-frameworks/svelte.md
@@ -0,0 +1,11 @@
+---
+title: Svelte
+description: The fastest JS framework
+weight: 2
+---
+
+Svelte is unique because it's very lightweight and fast. 
+It's easier than react to code in but honestly not very fun. But something being fun is
+subjective so I recommend trying it out! 
+
+- Svelte crash course: [Video by Traversy Media](https://www.youtube.com/watch?v=3TVy6GdtNuQ)
diff --git a/content/docs/resources-to-learn-programming/web-development/frontend/static-site-generators/_index.md b/content/docs/resources-to-learn-programming/web-development/frontend/static-site-generators/_index.md
new file mode 100644
index 0000000..6a59df6
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/frontend/static-site-generators/_index.md
@@ -0,0 +1,13 @@
+---
+title: Static Site Generators
+description: My favourite way of building a website
+weight: 2
+---
+
+Static site generators let you write a template for the website in HTML and let you write the content of the website in another format (markdown, for example)
+and turn it into a HTML page with the given template. 
+I love static site generators because they are easy to use and are very fast since all the HTML files are pre-compiled before you can host them on your server.
+It's better than writing the whole website in HTML because if you want to change the layout of the website, editing all the pages one-by-one would take a long time.
+Whereas in a static site generator, you can just edit the template file and it'll do the job automatically.
+
+For small websites/websites without much/any logic, I recommend using a static site generator. This website is written in Hugo, which is awesome.
diff --git a/content/docs/resources-to-learn-programming/web-development/frontend/static-site-generators/hugo.md b/content/docs/resources-to-learn-programming/web-development/frontend/static-site-generators/hugo.md
new file mode 100644
index 0000000..9664b30
--- /dev/null
+++ b/content/docs/resources-to-learn-programming/web-development/frontend/static-site-generators/hugo.md
@@ -0,0 +1,13 @@
+---
+title: Hugo
+description: The Hugo static site generator
+weight: 1
+---
+
+The website you're reading is built with Hugo. It's very customizable and fast. Unfortunately, learning Hugo can be tricky at first, but you'll come to
+love hugo after you understand it!
+
+- Hugo Tutorial: [Video by Luke Smith](https://www.youtube.com/watch?v=ZFL09qhKi5I)
+- Hugo Shortcodes: [Video by Luke Smith](https://www.youtube.com/watch?v=QTolhoxMyXg)
+
+You need a theme to create a Hugo website. If you don't want to create one yourself you can check out mine! <https://github.com/MikunoNaka/vidhukant-hugo>