Skip to content

Commit e11f9d2

Browse files
authored
Merge branch 'main' into prettier
2 parents 9f16fc5 + 7319484 commit e11f9d2

File tree

7 files changed

+183
-23
lines changed

7 files changed

+183
-23
lines changed

.gitignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,3 +22,5 @@ dist-ssr
2222
*.njsproj
2323
*.sln
2424
*.sw?
25+
26+
.env

index.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@
1313
href="https://fonts.googleapis.com/css2?family=Fira+Mono:wght@400;500;700&display=swap"
1414
rel="stylesheet"
1515
/>
16+
<meta name="google-site-verification" content="%VITE_GOOGLE_SITE_VERIFICATION%" />
1617
</head>
1718
<body>
1819
<div id="root"></div>
Loading
Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
![test](https://opengraph.githubassets.com/3bf2b12ea830ab581a1534e6b5c8cdef573e81607ea005103c03fe3c50212dae/maptime/getting-started-with-git-and-github)
2+
GitHub is a powerful tool for version control and collaboration, making it easier for developers to work on projects together. If you're new to GitHub, understanding how to set up your account and manage issues is crucial. In this guide, we'll walk you through the basics of setting up GitHub and using issues to track and manage tasks.
3+
4+
### Setting Up GitHub
5+
6+
**a. Create a GitHub Account**
7+
8+
1. **Sign Up**: Go to [GitHub's Sign Up page](https://github.com/join) and create a free account by providing your email address, creating a username, and setting a password.
9+
10+
2. **Verify Email**: GitHub will send you a verification email. Click the link in the email to verify your address.
11+
12+
3. **Complete Setup**: Follow the prompts to complete the setup process, including choosing a plan (the free plan is often sufficient for beginners).
13+
14+
**b. Install Git**
15+
16+
1. **Download Git**: Go to the [Git website](https://git-scm.com/) and download the appropriate version for your operating system.
17+
18+
2. **Install Git**: Follow the installation instructions. During installation, you can select default options if you're unsure.
19+
20+
**c. Configure Git**
21+
22+
1. **Open Terminal**: On Windows, you can use Git Bash; on macOS and Linux, use the terminal.
23+
24+
2. **Set Up User Info**: Configure Git with your GitHub username and email:
25+
26+
```bash
27+
git config --global user.name "Your Name"
28+
git config --global user.email "your.email@example.com"
29+
```
30+
31+
**d. Create a Repository**
32+
33+
1. **Create a New Repo**: On GitHub, click the "+" icon in the top-right corner and select "New repository."
34+
35+
2. **Fill in Details**: Enter a repository name, description, and choose whether it should be public or private.
36+
37+
3. **Initialize Repo**: Optionally, you can initialize the repository with a README file.
38+
39+
4. **Clone Repo**: Copy the repository URL and use the following command in your terminal to clone it to your local machine:
40+
41+
```bash
42+
git clone https://github.com/your-username/your-repo.git
43+
```
44+
45+
### Understanding GitHub Issues
46+
47+
GitHub Issues is a feature that allows you to track tasks, bugs, and feature requests in your repository. Here’s how to use it effectively:
48+
49+
**a. Creating an Issue**
50+
51+
1. **Navigate to Issues**: Go to your repository on GitHub and click on the "Issues" tab.
52+
53+
2. **New Issue**: Click the "New issue" button.
54+
55+
3. **Fill in Details**: Provide a descriptive title and details for the issue. You can also add labels, assign it to users, and set milestones if needed.
56+
57+
4. **Submit**: Click "Submit new issue" to create it.
58+
59+
**b. Managing Issues**
60+
61+
1. **View Issues**: You can view open and closed issues in the "Issues" tab.
62+
63+
2. **Comment**: You can add comments to issues to provide updates or ask questions.
64+
65+
3. **Close Issues**: When an issue is resolved, you can close it by clicking the "Close issue" button on the issue page.
66+
67+
4. **Labels and Milestones**: Use labels to categorize issues (e.g., bug, enhancement) and milestones to track progress towards a goal.
68+
69+
**c. Linking Issues to Pull Requests**
70+
71+
1. **Reference Issues**: When creating a pull request, you can reference issues by including keywords like "Fixes #issue-number" in the pull request description. This will automatically close the issue when the pull request is merged.
72+
73+
### Best Practices
74+
75+
- **Descriptive Titles**: Use clear and descriptive titles for issues to make it easy to understand the problem or task.
76+
- **Detailed Descriptions**: Provide as much detail as possible, including steps to reproduce issues or specifics about the task.
77+
- **Use Labels**: Apply appropriate labels to categorize and prioritize issues.
78+
79+
### Conclusion
80+
81+
GitHub is an essential tool for modern software development, and mastering its basics will set you up for success. By setting up your GitHub account, understanding how to manage issues, and using best practices, you’ll be well on your way to effective project management and collaboration. Happy coding!
82+
83+
> Written by **Sakib Ahmed** | [GitHub](https://github.com/devvsakib)

public/posts/index.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,5 +7,8 @@
77
},
88
{
99
"title": "git_hooks_automating_your_workflow"
10+
},
11+
{
12+
"title": "getting_started_with_github_issues_and_setup"
1013
}
1114
]

src/pages/Doc/single doc/index.jsx

Lines changed: 81 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -64,29 +64,89 @@ const DocDetail = () => {
6464
}
6565
setHeadings(headings);
6666
};
67+
if (loading) return <div className="flex justify-center items-center h-screen"><Spin size="large" /></div>;
68+
if (error) return <Alert message="Error" description={error} type="error" />;
69+
const headingToId = (children) => String(children).toLowerCase().replace(/\s+/g, '-');
70+
return (
71+
<Layout>
72+
<section className="container mx-auto p-4 min-h-screen">
73+
<h3 className="text-2xl md:text-3xl capitalize text-center my-10 mb-20 font-semibold">
74+
{slug.replace(/_/g, ' ')}
75+
</h3>
76+
<div className="flex">
77+
<aside className="sticky top-20 w-1/4 p-4 h-0">
78+
<h2 className="text-xl font-bold mb-2">Table of Contents</h2>
79+
<ul className='grid gap-2'>
80+
{headings.map((heading, index) => (
81+
<li key={index} className={`ml-${heading.level} ${activeSection === heading.title.replace(/\s+/g, '-').toLowerCase() && 'text-green-500 font-semibold'}`}>
82+
<a href={`#${heading.title.replace(/\s+/g, '-').toLowerCase()}`}
6783

68-
useEffect(() => {
69-
if (content) {
70-
extractHeadings(content);
71-
}
72-
}, [content]);
73-
74-
useEffect(() => {
75-
const hash = window.location.hash;
76-
if (hash) {
77-
const id = hash.substring(1);
78-
const element = document.getElementById(id);
79-
if (element) {
80-
element.scrollIntoView({ behavior: "smooth" });
81-
}
82-
}
83-
}, [content]);
84+
onClick={() => setActiveSection(heading.title.replace(/\s+/g, '-')?.toLowerCase())}
85+
>
86+
{heading.title}
87+
</a>
88+
</li>
89+
))}
90+
</ul>
91+
</aside>
92+
<div className="prose lg:prose-xl w-3/4">
93+
<ReactMarkdown
94+
remarkPlugins={[remarkGfm]}
95+
components={{
96+
code({ node, inline, className, children, ...props }) {
97+
const match = /language-(\w+)/.exec(className || '');
98+
return !inline && match ? (
99+
<SyntaxHighlighter
100+
style={a11yDark}
101+
language={match[1]}
102+
PreTag="div"
103+
{...props}
104+
>
105+
{String(children).replace(/\n$/, '')}
106+
</SyntaxHighlighter>
107+
) : (
108+
<code className={className} {...props}>
109+
{children}
110+
</code>
111+
);
112+
},
113+
h1({ node, children }) {
114+
return <h1 className='text-xl font-normal mt-10 mb-3' id={headingToId(children)}> {children}</h1>;
115+
},
116+
h2({ node, children }) {
117+
return <h2 className='text-xl font-normal mt-10 mb-3' id={headingToId(children)}>🌿 {children}</h2>;
118+
},
119+
h3({ node, children }) {
120+
return <h3 className='text-xl font-normal mt-10 mb-3' id={headingToId(children)}>🌿 {children}</h3>;
121+
},
122+
blockquote({ node, children }) {
123+
return <span className='bg-gray-100 p-4 pl-0 text-sm my-4 block text-gray'>{children}</span>;
124+
},
125+
table: Table,
126+
tr: TableRow,
127+
td: TableCell,
128+
th: TableHeader,
129+
li({ node, children }) {
130+
return <li className='list-disc ml-4'>{children}</li>;
131+
},
132+
ul({ node, children }) {
133+
return <ul className='list-disc ml-4 mb-2'>{children}</ul>;
134+
},
135+
ol({ node, children }) {
136+
return <ul className='list-disc ml-4 mb-2'>{children}</ul>;
137+
},
138+
img({ node, src, alt }) {
139+
return <img src={src} alt={alt} className='mb-4 rounded-md' />;
140+
}
84141

85-
if (loading)
86-
return (
87-
<div className="flex justify-center items-center h-screen">
88-
<Spin size="large" />
89-
</div>
142+
}}
143+
>
144+
{content}
145+
</ReactMarkdown>
146+
</div>
147+
</div>
148+
</section>
149+
</Layout>
90150
);
91151
if (error) return <Alert message="Error" description={error} type="error" />;
92152

vite.config.js

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,5 +3,16 @@ import react from "@vitejs/plugin-react";
33

44
// https://vitejs.dev/config/
55
export default defineConfig({
6-
plugins: [react()],
7-
});
6+
7+
plugins: [
8+
react(),
9+
{
10+
name: 'html-transform',
11+
transformIndexHtml(html) {
12+
return html.replace(
13+
'%VITE_GOOGLE_SITE_VERIFICATION%',
14+
process.env.VITE_GOOGLE_SITE_VERIFICATION
15+
);
16+
}
17+
}],
18+
})

0 commit comments

Comments
 (0)