Skip to content

Commit

Permalink
Merge branch 'main' into prettier
Browse files Browse the repository at this point in the history
  • Loading branch information
Bashamega authored Jul 29, 2024
2 parents 9f16fc5 + 7319484 commit e11f9d2
Show file tree
Hide file tree
Showing 7 changed files with 183 additions and 23 deletions.
2 changes: 2 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -22,3 +22,5 @@ dist-ssr
*.njsproj
*.sln
*.sw?

.env
1 change: 1 addition & 0 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@
href="https://fonts.googleapis.com/css2?family=Fira+Mono:wght@400;500;700&display=swap"
rel="stylesheet"
/>
<meta name="google-site-verification" content="%VITE_GOOGLE_SITE_VERIFICATION%" />
</head>
<body>
<div id="root"></div>
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
83 changes: 83 additions & 0 deletions public/posts/getting_started_with_github_issues_and_setup.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
![test](https://opengraph.githubassets.com/3bf2b12ea830ab581a1534e6b5c8cdef573e81607ea005103c03fe3c50212dae/maptime/getting-started-with-git-and-github)
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.

### Setting Up GitHub

**a. Create a GitHub Account**

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.

2. **Verify Email**: GitHub will send you a verification email. Click the link in the email to verify your address.

3. **Complete Setup**: Follow the prompts to complete the setup process, including choosing a plan (the free plan is often sufficient for beginners).

**b. Install Git**

1. **Download Git**: Go to the [Git website](https://git-scm.com/) and download the appropriate version for your operating system.

2. **Install Git**: Follow the installation instructions. During installation, you can select default options if you're unsure.

**c. Configure Git**

1. **Open Terminal**: On Windows, you can use Git Bash; on macOS and Linux, use the terminal.

2. **Set Up User Info**: Configure Git with your GitHub username and email:

```bash
git config --global user.name "Your Name"
git config --global user.email "[email protected]"
```

**d. Create a Repository**

1. **Create a New Repo**: On GitHub, click the "+" icon in the top-right corner and select "New repository."

2. **Fill in Details**: Enter a repository name, description, and choose whether it should be public or private.

3. **Initialize Repo**: Optionally, you can initialize the repository with a README file.

4. **Clone Repo**: Copy the repository URL and use the following command in your terminal to clone it to your local machine:

```bash
git clone https://github.com/your-username/your-repo.git
```

### Understanding GitHub Issues

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:

**a. Creating an Issue**

1. **Navigate to Issues**: Go to your repository on GitHub and click on the "Issues" tab.

2. **New Issue**: Click the "New issue" button.

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.

4. **Submit**: Click "Submit new issue" to create it.

**b. Managing Issues**

1. **View Issues**: You can view open and closed issues in the "Issues" tab.

2. **Comment**: You can add comments to issues to provide updates or ask questions.

3. **Close Issues**: When an issue is resolved, you can close it by clicking the "Close issue" button on the issue page.

4. **Labels and Milestones**: Use labels to categorize issues (e.g., bug, enhancement) and milestones to track progress towards a goal.

**c. Linking Issues to Pull Requests**

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.

### Best Practices

- **Descriptive Titles**: Use clear and descriptive titles for issues to make it easy to understand the problem or task.
- **Detailed Descriptions**: Provide as much detail as possible, including steps to reproduce issues or specifics about the task.
- **Use Labels**: Apply appropriate labels to categorize and prioritize issues.

### Conclusion

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!

> Written by **Sakib Ahmed** | [GitHub](https://github.com/devvsakib)
3 changes: 3 additions & 0 deletions public/posts/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,5 +7,8 @@
},
{
"title": "git_hooks_automating_your_workflow"
},
{
"title": "getting_started_with_github_issues_and_setup"
}
]
102 changes: 81 additions & 21 deletions src/pages/Doc/single doc/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -64,29 +64,89 @@ const DocDetail = () => {
}
setHeadings(headings);
};
if (loading) return <div className="flex justify-center items-center h-screen"><Spin size="large" /></div>;
if (error) return <Alert message="Error" description={error} type="error" />;
const headingToId = (children) => String(children).toLowerCase().replace(/\s+/g, '-');
return (
<Layout>
<section className="container mx-auto p-4 min-h-screen">
<h3 className="text-2xl md:text-3xl capitalize text-center my-10 mb-20 font-semibold">
{slug.replace(/_/g, ' ')}
</h3>
<div className="flex">
<aside className="sticky top-20 w-1/4 p-4 h-0">
<h2 className="text-xl font-bold mb-2">Table of Contents</h2>
<ul className='grid gap-2'>
{headings.map((heading, index) => (
<li key={index} className={`ml-${heading.level} ${activeSection === heading.title.replace(/\s+/g, '-').toLowerCase() && 'text-green-500 font-semibold'}`}>
<a href={`#${heading.title.replace(/\s+/g, '-').toLowerCase()}`}

useEffect(() => {
if (content) {
extractHeadings(content);
}
}, [content]);

useEffect(() => {
const hash = window.location.hash;
if (hash) {
const id = hash.substring(1);
const element = document.getElementById(id);
if (element) {
element.scrollIntoView({ behavior: "smooth" });
}
}
}, [content]);
onClick={() => setActiveSection(heading.title.replace(/\s+/g, '-')?.toLowerCase())}
>
{heading.title}
</a>
</li>
))}
</ul>
</aside>
<div className="prose lg:prose-xl w-3/4">
<ReactMarkdown
remarkPlugins={[remarkGfm]}
components={{
code({ node, inline, className, children, ...props }) {
const match = /language-(\w+)/.exec(className || '');
return !inline && match ? (
<SyntaxHighlighter
style={a11yDark}
language={match[1]}
PreTag="div"
{...props}
>
{String(children).replace(/\n$/, '')}
</SyntaxHighlighter>
) : (
<code className={className} {...props}>
{children}
</code>
);
},
h1({ node, children }) {
return <h1 className='text-xl font-normal mt-10 mb-3' id={headingToId(children)}> {children}</h1>;
},
h2({ node, children }) {
return <h2 className='text-xl font-normal mt-10 mb-3' id={headingToId(children)}>🌿 {children}</h2>;
},
h3({ node, children }) {
return <h3 className='text-xl font-normal mt-10 mb-3' id={headingToId(children)}>🌿 {children}</h3>;
},
blockquote({ node, children }) {
return <span className='bg-gray-100 p-4 pl-0 text-sm my-4 block text-gray'>{children}</span>;
},
table: Table,
tr: TableRow,
td: TableCell,
th: TableHeader,
li({ node, children }) {
return <li className='list-disc ml-4'>{children}</li>;
},
ul({ node, children }) {
return <ul className='list-disc ml-4 mb-2'>{children}</ul>;
},
ol({ node, children }) {
return <ul className='list-disc ml-4 mb-2'>{children}</ul>;
},
img({ node, src, alt }) {
return <img src={src} alt={alt} className='mb-4 rounded-md' />;
}

if (loading)
return (
<div className="flex justify-center items-center h-screen">
<Spin size="large" />
</div>
}}
>
{content}
</ReactMarkdown>
</div>
</div>
</section>
</Layout>
);
if (error) return <Alert message="Error" description={error} type="error" />;

Expand Down
15 changes: 13 additions & 2 deletions vite.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,5 +3,16 @@ import react from "@vitejs/plugin-react";

// https://vitejs.dev/config/
export default defineConfig({
plugins: [react()],
});

plugins: [
react(),
{
name: 'html-transform',
transformIndexHtml(html) {
return html.replace(
'%VITE_GOOGLE_SITE_VERIFICATION%',
process.env.VITE_GOOGLE_SITE_VERIFICATION
);
}
}],
})

0 comments on commit e11f9d2

Please sign in to comment.