Skip to content

Commit 1f68f14

Browse files
committed
2 parents 5de1f65 + a91e0f7 commit 1f68f14

File tree

16 files changed

+1322
-557
lines changed

16 files changed

+1322
-557
lines changed

docs/GitHub/intro-github.md

Lines changed: 17 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -17,20 +17,20 @@ description: In this tutorial, you will learn about GitHub, its importance, what
1717
GitHub is a web-based platform used for version control and collaboration. It allows developers to work together on projects from anywhere in the world. GitHub is built on top of Git, a distributed version control system created by Linus Torvalds in 2005.
1818

1919
:::note
20-
Key Features of SQL:
20+
Key Features of GitHub:
2121
GitHub will help you to control the version of the project on a large scale.
2222

23-
GitHub offers <a href="https://github.com/pricing">Premium</a> account for use, Premium users get unlimited Github Repo time, Storage etc.
23+
GitHub offers <a href="https://github.com/pricing">Premium</a> account for use, Premium users get unlimited GitHub Repo time, Storage etc.
2424

2525
:::
2626

2727
## How to start with GitHub?
2828

29-
Whenever you create something exciting or something new on your own, you always want to show it to others. As programmers, we also want to show our projects and codes to others, but how? So GitHub is the solution, it let's people to collaborate and scale the projects all on cloud. Some other example of simillar platform are , Bitbucket, GitLab, Beanstalk, etc. Many of them give you the facility to work on your code together as a team. Currently, Github is more popular than other above-listed platforms for hosting your code.
29+
Whenever you create something exciting or something new on your own, you always want to show it to others. As programmers, we also want to show our projects and codes to others, but how? So GitHub is the solution, it let's people to collaborate and scale the projects all on cloud. Some other example of similar platform are Bitbucket, GitLab, Beanstalk, etc. Many of them give you the facility to work on your code together as a team. Currently, GitHub is more popular than other above-listed platforms for hosting your code.
3030
:::info
31-
In the picture below you could see Developer 1, Developer 2... are working on the same project , lets say they are trying to build a amazon website, developer 1 handles the Mens shopping section, Developer 2 deals with Womens section, Developer 3 works on the login feature.
31+
In the picture below, you can see Developer 1, Developer 2, etc., working on the same project. Let's say they are trying to build an Amazon website; Developer 1 handles the men's shopping section, Developer 2 deals with the women's section, and Developer 3 works on the login feature.
3232

33-
So each indivituals works on different feature from the copy of the central repository, once the development is done they push changes to the **remote repository** (central repo as per picture). Once **code review** happens and good to go, the senior developer will merge the code to the central repository so all the feature will be live on production.
33+
So, each individual works on a different feature from a copy of the central repository, once the development is done they push changes to the *remote repository* (central repo as per picture). Once a code review happens and it is good to go, the senior developer will merge the code into the central repository so all the features will be live in production.
3434
:::
3535

3636
<BrowserWindow url="https://github.com/" bodyStyle={{padding: 0}}>
@@ -41,36 +41,36 @@ So each indivituals works on different feature from the copy of the central repo
4141

4242
## What is Git??
4343

44-
So in the above example all the developer where able to work on different feautre simulatneaulsy because of the git. For uploading your project to your Github account, you need to install Git first. In other words, Git helps to do this version management of the files and coordinating work among the diverse team in the software development phase. Git is an open-source project and developed in 2005 by Linus Torvalds and Junior.
44+
In the above example, all the developers were able to work on different features simultaneously because of Git. For uploading your project to your GitHub account, you need to install Git first. In other words, Git helps with the version management of files and coordinates work among a diverse team in the software development phase. Git is an open-source project and developed in 2005 by Linus Torvalds and Junior.
4545

4646

4747

4848
:::info
49-
1. **What is Version control System?**: To understand the version control system, let me give you one example; sometimes, you wish you have a record that contains all the changes you made in your code or your project. The version control systems are software tools that record all of your changes in the files. It is like a database of changes. Git is a version control system that most developers prefer to use. We will see how you can upload your code on Github using Git. With VCS you can track the branch, who made changes at what time, line of code added, retrive the previous version of changes.
49+
1. *What is Version control System?*: To understand the version control system, let me give you one example; sometimes, you wish you have a record that contains all the changes you made in your code or your project. The version control systems are software tools that record all of your changes in the files. It is like a database of changes. Git is a version control system that most developers prefer to use. We will see how you can upload your code on GitHub using Git. With VCS you can track the branch, who made changes at what time, line of code added, retrieve the previous version of changes.
5050
2. Basic Git Terminology::
5151

5252
| Keyword | Terminology | Description |
5353
| --- | --------------- | -------------------- |
5454
| VCS | Version Control System | Track changes to a collection of files |
55-
| SCM | Software configuration Management | Another name for VCS, the earlier version of VCS like CVS, SVN used to be centralised server, which cause single point of failure. |
55+
| SCM | Software configuration Management | Another name for VCS,earlier versions of VCS, like CVS and SVN, used a centralized server, which caused a single point of failure. |
5656
| DVCS | Distributed Version Control System| Git is distributed, the project history is stored both in client and server. Means you can make changes locally and remote. |
5757
| Working Tree | Tree | Current version of files where the active project is on |
58-
| Repo | Repository | Top of working Tree where git keep all records and history. |
58+
| Repo | Repository | Top of the working tree where Git keeps all records and history. |
5959
| Bare repo | | Not part of working Tree ends with .git, eg. backup.git |
6060
| Hash | 160 bit long SHA-1 | Based on the hash number, the file has been modified or not. |
61-
| Object | Git have 4 objects | Tree Object(directory, names), Blob Object(main file), Commit Object(spesfic versions), Tag(name attached to commit) |
61+
| Object | Git has 4 objects | Tree Object(directory, names), Blob Object(main file), Commit Object(specific versions), Tag(name attached to commit) |
6262
| Commit | | Makes Changes |
63-
| Branch | a series of Linked commit | The recent commit is called Head. |
63+
| Branch | A series of linked commits | The most recent commit is called Head. |
6464
| Remote | | reference to other git repo |
6565
| | Git Command | Check this tutorial
6666

6767
:::
6868

6969
## Why Learn GitHub?
7070

71-
GitHub Simplfy all the command line interface of Git and make it more GUI friendly. GitHub has builds above of git. Here want we do is staging the files and doing the commit, You can clone the entire repository and create a branch and commit to that branch ask the main developer to merge the branch. when you clone in reality you are creating a copy of the real code/repository in your local environment.
71+
GitHub simplifies the command-line interface of Git and makes it more GUI-friendly. GitHub is built on top of Git. Here want we do is staging the files and doing the commit, You can clone the entire repository, create a branch, commit to that branch, and then ask the main developer to merge the branch. When you clone in reality you are creating a copy of the real code/repository in your local environment.
7272

73-
![Git Structure](./assets/2-git-strucutre.png)
73+
[![Git Structure](./assets/2-git-strucutre.png)]
7474

7575

7676
:::info
@@ -82,19 +82,21 @@ GitHub Simplfy all the command line interface of Git and make it more GUI friend
8282
| Discussions | Place where a community discussion can happen |
8383
| Pull requests | PR - Once the user worked on the issue, they can develop the feature and ask to merge |
8484
| Labels | Feature to categorise the issue, like bug, deadline, feature |
85-
| Actions | To automate the entire process of repatitive task on GitHub |
85+
| Actions | To automate the entire process of repeitive task on GitHub |
8686
| Forks | Cloning the original repo to your name |
8787

8888

8989
The fork is a personal copy of the repo which is already present or uploaded in GitHub by a different user. Once you fork and make changes to the repository the changes will happen to your forked repo, not the real one.
9090

9191
:::
9292

93+
< />
9394

9495
### Watch the video Tutorial
9596
<iframe width="880" height="480" src="https://www.youtube.com/embed/GrTV59Y84S8?list=PLrLTYhoDFx-kiuFiGQqVpYYZ56pIhUW63" title="How to start with GitHub in 2024 | Beginner&#39;s Guide" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
9697

98+
< />
9799

98100
## Conclusion
99101

100-
If you think this Github Tutorial starter kit for Beginner was useful to you, then don’t forget to share it with others. Till then, we will meet For uploading your project to your Github account, you need to install Git first. which we will discuss in detail in the next post.
102+
If you think this GitHub Tutorial starter kit for Beginner was useful to you, then don’t forget to share it with others. We will discuss this in detail in the next post. or In the next post, we will discuss how to upload your project to your GitHub account using Git.

docusaurus.config.ts

Lines changed: 23 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,10 @@ const config: Config = {
6767
theme: {
6868
customCss: require.resolve("./src/css/custom.css"),
6969
},
70+
gtag: {
71+
trackingID: 'G-W02Z2VJYCR',
72+
anonymizeIP: false,
73+
},
7074
} satisfies Preset.Options,
7175
],
7276
],
@@ -87,13 +91,13 @@ const config: Config = {
8791
items: [
8892
{
8993
type: "dropdown",
90-
html: '<span class="nav-emoji">📚</span> Docs',
94+
html: '<span id="nav-docs"></span> Docs',
9195
position: "left",
9296
items: [
9397
{
9498
type: "html",
9599
value: `<div class="grid grid-cols-3 gap-4 w-xl">
96-
<a class="border-r col-span-1" href="/courses/">Tutorials</a>
100+
<a class="border-r col-span-1" href="/courses/" style="color:black ; ">Tutorials</a>
97101
<div class="grid grid-cols-4 col-span-2">
98102
<a href="/docs/category/sql/" class="nav__icons"> <img src="/icons/sql.svg" title="SQL" alt="SQL" /> </a>
99103
<a href="/docs/category/python/" class="nav__icons"> <img src="/icons/python.svg" title="Python" alt="Python" /> </a>
@@ -109,7 +113,7 @@ const config: Config = {
109113
{
110114
type: "html",
111115
value: `<div class="grid grid-cols-3 gap-4">
112-
<a class="border-r col-span-1" href="/courses/"> Courses </a>
116+
<a class="border-r col-span-1" href="/courses/" style="color:black"> Courses </a>
113117
<div class="grid grid-cols-4 col-span-2">
114118
<a href="https://www.youtube.com/watch?v=GrTV59Y84S8&list=PLrLTYhoDFx-kiuFiGQqVpYYZ56pIhUW63&ab_channel=RecodeHive" class="nav__icons"> <img src="/icons/git.svg" alt="git" /> </a>
115119
<a href="https://www.youtube.com/watch?v=O1ahDsq8DU0&list=PLrLTYhoDFx-k62rLLajSB-jeqKwLkDrkF&ab_channel=RecodeHive" class="nav__icons"> <img src="/icons/postman.svg" alt="Postman" /> </a>
@@ -124,73 +128,73 @@ const config: Config = {
124128
{
125129
type: "html",
126130
value: `<div class="grid grid-cols-3 gap-4">
127-
<a class="border-r col-span-1" href="#" target="_self"> Interview Prep </a>
131+
<a class="border-r col-span-1" href="#" target="_self" style="color:black"> Interview Prep </a>
128132
<div class="grid grid-cols-1 col-span-2">
129-
<a href="/interview-prep/" target="_self" class="nav__icons"> 🧩Technical </a> <br />
130-
<a href="/interview-prep/" target="_self" class="nav__icons"> 💡Behavioral </a>
133+
<a href="/interview-prep/" target="_self" class="nav__icons"><span id="nav-technical" style="display:inline-flex;align-items:center;"></span> Technical</a> <br />
134+
<a href="/interview-prep/" target="_self" class="nav__icons"><span id="nav-behavioral" style="display:inline-flex;align-items:center;"></span> Behavioral</a>
131135
</div>
132136
</div>`,
133137
},
134138
],
135139
},
136140
{
137141
to: "/showcase",
138-
html: '<span class="nav-emoji">🌍</span> Showcase',
142+
html: '<span id="nav-showcase"></span> Showcase',
139143
position: "left",
140144
},
141145
{
142146
to: "/dashboard",
143-
html: '<span class="nav-emoji">📊</span> Dashboard',
147+
html: '<span id="nav-dashboard"></span> Dashboard',
144148
position: "left",
145149
},
146150
{
147151
to: "/our-sponsors/",
148-
html: '<span class="nav-emoji">💰</span> Donate',
152+
html: '<span id="nav-donate"></span> Donate',
149153
position: "left",
150154
},
151155
{
152156
type: "dropdown",
153-
html: '<span class="nav-emoji">👩🏻‍💻</span> Devfolio',
157+
html: '<span id="nav-devfolio"></span> Devfolio',
154158
position: "left",
155159
items: [
156160
{
157-
label: "💻GitHub Profiles",
161+
html: '<span id="nav-github" style="display:inline-flex;align-items:center;"></span> GitHub Profiles',
158162
to: "https://dev.recodehive.com/devfolio",
159163
},
160164
{
161-
label: "🎖️ GitHub Badges",
165+
html: '<span id="nav-badges" style="display:inline-flex;align-items:center;"></span> GitHub Badges',
162166
to: "/badges/github-badges/",
163167
},
164168
],
165169
},
166170
{
167171
to: "/blogs",
168-
html: '<span class="nav-emoji">📰</span> Blogs',
172+
html: '<span id="nav-blogs"></span> Blogs',
169173
position: "left",
170174
},
171175
{
172176
type: "dropdown",
173-
html: '<span class="nav-emoji">🔗</span> More',
177+
html: '<span id="nav-more"></span> More',
174178
position: "left",
175179
items: [
176180
{
177-
label: "📚 E-books",
181+
html: '<span id="nav-ebooks" style="display:inline-flex;align-items:center;"></span> E-books',
178182
to: "https://learn.recodehive.com/datascience",
179183
},
180184
{
181-
label: "🛣️ Roadmap",
185+
html: '<span id="nav-roadmap" style="display:inline-flex;align-items:center;"></span> Roadmap',
182186
to: "#",
183187
},
184188
{
185-
label: "🤝 Community",
189+
html: '<span id="nav-community" style="display:inline-flex;align-items:center;"></span> Community',
186190
to: "/community",
187191
},
188192
{
189-
label: "📺 Broadcast",
193+
html: '<span id="nav-broadcast" style="display:inline-flex;align-items:center;"></span> Broadcast',
190194
to: "/broadcasts/",
191195
},
192196
{
193-
label: "🎙️ Podcast",
197+
html: '<span id="nav-podcast" style="display:inline-flex;align-items:center;"></span> Podcast',
194198
to: "/podcasts/",
195199
},
196200
],

src/components/CustomSidebar.module.css

Whitespace-only changes.

src/components/CustomSidebar.tsx

Whitespace-only changes.
Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
import React from "react";
2+
import {
3+
Book,
4+
Eye,
5+
LayoutDashboard,
6+
DollarSign,
7+
User,
8+
Newspaper,
9+
MoreHorizontal,
10+
Github,
11+
BadgeCheck,
12+
FileText,
13+
Users,
14+
Tv,
15+
Mic,
16+
Lightbulb,
17+
Puzzle,
18+
} from "lucide-react";
19+
20+
const iconMap: Record<string, React.ReactNode> = {
21+
Docs: <Book size={18} style={{ verticalAlign: "middle" }} />,
22+
Showcase: <Eye size={18} style={{ verticalAlign: "middle" }} />,
23+
Dashboard: <LayoutDashboard size={18} style={{ verticalAlign: "middle" }} />,
24+
Donate: <DollarSign size={18} style={{ verticalAlign: "middle" }} />,
25+
Devfolio: <User size={18} style={{ verticalAlign: "middle" }} />,
26+
Blogs: <Newspaper size={18} style={{ verticalAlign: "middle" }} />,
27+
More: <MoreHorizontal size={18} style={{ verticalAlign: "middle" }} />,
28+
GitHub: <Github size={18} style={{ verticalAlign: "middle" }} />,
29+
Badges: <BadgeCheck size={18} style={{ verticalAlign: "middle" }} />,
30+
Ebooks: <FileText size={18} style={{ verticalAlign: "middle" }} />,
31+
Roadmap: <LayoutDashboard size={18} style={{ verticalAlign: "middle" }} />,
32+
Community: <Users size={18} style={{ verticalAlign: "middle" }} />,
33+
Broadcast: <Tv size={18} style={{ verticalAlign: "middle" }} />,
34+
Podcast: <Mic size={18} style={{ verticalAlign: "middle" }} />,
35+
Behavioral: <Lightbulb size={18} style={{ verticalAlign: "middle" }} />,
36+
Technical: <Puzzle size={18} style={{ verticalAlign: "middle" }} />,
37+
};
38+
39+
export default function NavbarIcon({ name }: { name: string }) {
40+
return (
41+
<span
42+
style={{
43+
display: "inline-flex",
44+
alignItems: "center",
45+
gap: 4,
46+
marginRight: 2,
47+
}}
48+
>
49+
{iconMap[name] || null}
50+
</span>
51+
);
52+
}
Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
import React, { useEffect } from "react";
2+
import NavbarIcon from "./NavbarIcon";
3+
4+
const iconMap = [
5+
{ id: "nav-docs", name: "Docs" },
6+
{ id: "nav-showcase", name: "Showcase" },
7+
{ id: "nav-dashboard", name: "Dashboard" },
8+
{ id: "nav-donate", name: "Donate" },
9+
{ id: "nav-devfolio", name: "Devfolio" },
10+
{ id: "nav-blogs", name: "Blogs" },
11+
{ id: "nav-more", name: "More" },
12+
// Sub nav items
13+
{ id: "nav-github", name: "GitHub" },
14+
{ id: "nav-badges", name: "Badges" },
15+
{ id: "nav-ebooks", name: "Ebooks" },
16+
{ id: "nav-roadmap", name: "Roadmap" },
17+
{ id: "nav-community", name: "Community" },
18+
{ id: "nav-broadcast", name: "Broadcast" },
19+
{ id: "nav-podcast", name: "Podcast" },
20+
{ id: "nav-technical", name: "Technical" },
21+
{ id: "nav-behavioral", name: "Behavioral" },
22+
];
23+
24+
export default function NavbarIconInjector() {
25+
useEffect(() => {
26+
iconMap.forEach(({ id, name }) => {
27+
const el = document.getElementById(id);
28+
if (el && el.childNodes.length === 0) {
29+
import("react-dom").then((ReactDOM) => {
30+
(ReactDOM.default as any).render(<NavbarIcon name={name} />, el);
31+
});
32+
}
33+
});
34+
}, []);
35+
return null;
36+
}

0 commit comments

Comments
 (0)