Skip to content

Commit 71d65fd

Browse files
committed
Added README and CONTRIBUTING files
1 parent 9a85b78 commit 71d65fd

File tree

4 files changed

+172
-42
lines changed

4 files changed

+172
-42
lines changed

CONTRIBUTING.md

Lines changed: 129 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,129 @@
1+
# Contributing to QuickSnip
2+
3+
Hey there! 👋 First off, thanks for taking the time to contribute! ❤️
4+
5+
You can contribute in two main ways:
6+
7+
- **Improving the code** (like fixing bugs or adding cool new features)
8+
- **Adding new code snippets** (or improving the existing ones!)
9+
10+
---
11+
12+
## Improving the code
13+
14+
If you have a feature request or want to fix a bug, feel free to:
15+
16+
- [Open an Issue](https://github.com/dostonnabotov/sass-template/issues) to let me know what’s up.
17+
- [Send a pull request](https://github.com/dostonnabotov/sass-template/pulls) with your changes.
18+
19+
---
20+
21+
## Adding Snippets
22+
23+
### Adding to an Existing Category
24+
25+
1. **Find the language file:**
26+
27+
Head over to the `/public/data` folder and locate the language file you need, like javascript.json or python.json
28+
29+
2. **Find the category:**
30+
31+
Look for the categoryName where your snippet belongs.
32+
33+
3. **Add your snippet** in this format:
34+
35+
```json
36+
{
37+
"title": "Name of the snippet",
38+
"description": "A short explanation of what the snippet does",
39+
"code": "your code goes here",
40+
"tags": ["tag1", "tag2", "tag3"],
41+
"author": "your_github_username"
42+
}
43+
```
44+
45+
Here’s an example for JavaScript:
46+
47+
```json
48+
// javascript.json
49+
[
50+
{
51+
"categoryName": "Date and Time",
52+
"snippets": [
53+
{
54+
"title": "Format Date",
55+
"description": "Formats a date in 'YYYY-MM-DD' format.",
56+
"code": "const formatDate = (date) => date.toISOString().split('T')[0];\n\n// Usage:\nconsole.log(formatDate(new Date())); // Output: '2024-12-10'",
57+
"tags": ["javascript", "date", "format"],
58+
"author": "technoph1le"
59+
}
60+
]
61+
}
62+
]
63+
```
64+
65+
### Adding a New Category
66+
67+
If your snippet doesn’t fit into any existing category, you can create a new one! Just make sure it’s unique and doesn’t overlap with others (e.g., don’t create separate categories for “Date” and “Time” when “Date and Time” works).
68+
69+
Use this format:
70+
71+
```json
72+
[
73+
{
74+
"categoryName": "New Category Name",
75+
"snippets": [
76+
{
77+
"title": "Name of the snippet",
78+
"description": "A short explanation of what it does",
79+
"code": "your code goes here",
80+
"tags": ["tag1", "tag2", "tag3"],
81+
"author": "your_github_username"
82+
}
83+
]
84+
}
85+
]
86+
```
87+
88+
### Adding a New Language
89+
90+
Want to include a new programming language? Here's what to do:
91+
92+
1. **Create a new file:**
93+
94+
In the `/public/data` folder, create a file named after the language (e.g., `go.json`).
95+
96+
2. **Add categories and snippets:**
97+
98+
Follow the formats explained above.
99+
100+
3. **Update the `_index.json`:**
101+
102+
Add your new language like this:
103+
104+
```json
105+
[
106+
{
107+
"lang": "Go",
108+
"icon": "/icons/go.svg"
109+
}
110+
]
111+
```
112+
113+
4. **Include an icon:**
114+
115+
Upload a logo for your language into the `/public/icons` folder. Make sure the filename matches the one you used in `_index.json`. Icons should be 50x50px in `.svg` format.
116+
117+
5. **Double-check your work:**
118+
119+
Test on your side and confirm if it works properly.
120+
121+
---
122+
123+
## Final Notes
124+
125+
Whether you’re fixing a tiny typo, writing a new snippet, or dreaming up big features, every bit counts! 🛠️
126+
127+
If you have any questions or need help, feel free to open an issue or tag me.
128+
129+
Happy coding! 💻✨

README.md

Lines changed: 41 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,50 +1,50 @@
1-
# React + TypeScript + Vite
1+
# QuickSnip
22

3-
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
3+
An open-source project that categorizes handy code snippets across various programming languages. Built with love and powered by an awesome community. 🚀
44

5-
Currently, two official plugins are available:
5+
## How to contribute
66

7-
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
8-
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
7+
Want to help make QuickSnip even better? You can contribute by:
98

10-
## Expanding the ESLint configuration
9+
- **Improving the Code**: Fix bugs, suggest new features, or optimize the project.
10+
- **Adding New Snippets**: Share your favorite snippets to grow the database.
11+
Be sure to check out the [CONTRIBUTING.md](/CONTRIBUTING.md) file for detailed guidelines.
1112

12-
If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
13+
### Improving the code
1314

14-
- Configure the top-level `parserOptions` property like this:
15+
Got a feature idea or bug fix? Here's how you can contribute:
1516

16-
```js
17-
export default tseslint.config({
18-
languageOptions: {
19-
// other options...
20-
parserOptions: {
21-
project: ['./tsconfig.node.json', './tsconfig.app.json'],
22-
tsconfigRootDir: import.meta.dirname,
23-
},
24-
},
25-
})
26-
```
17+
- [Open an issue](https://github.com/dostonnabotov/sass-template/issues) to share your ideas or report a bug.
18+
- [Send a pull request](https://github.com/dostonnabotov/sass-template/pulls) with your changes.
19+
20+
### Adding a Snippet
21+
22+
The snippets database is located in the `/public/data` folder.
2723

28-
- Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked`
29-
- Optionally add `...tseslint.configs.stylisticTypeChecked`
30-
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config:
31-
32-
```js
33-
// eslint.config.js
34-
import react from 'eslint-plugin-react'
35-
36-
export default tseslint.config({
37-
// Set the react version
38-
settings: { react: { version: '18.3' } },
39-
plugins: {
40-
// Add the react plugin
41-
react,
42-
},
43-
rules: {
44-
// other rules...
45-
// Enable its recommended rules
46-
...react.configs.recommended.rules,
47-
...react.configs['jsx-runtime'].rules,
48-
},
49-
})
24+
If you’d like to add a snippet for an **existing language** and **category**, use the following format:
25+
26+
```json
27+
{
28+
"title": "Name of the snippet",
29+
"description": "A brief description of what it does",
30+
"code": "code goes here",
31+
"tags": ["tag1", "tag2", "tag3"],
32+
"author": "your_github_username"
33+
}
5034
```
35+
36+
For details about adding new categories or programming languages, check out the [CONTRIBUTING.md](/CONTRIBUTING.md) file.
37+
38+
## Guidelines for Contributions
39+
40+
To keep things smooth and consistent, please:
41+
42+
- Use proper JSON formatting.
43+
- Include all mandatory fields in the snippet.
44+
- Test your snippet to ensure it works as expected.
45+
46+
Following these guidelines helps me (and everyone else) review and merge your contributions faster.
47+
48+
## License
49+
50+
QuickSnip is licensed under the [MIT License](/LICENSE). Feel free to use and share it as you like.
File renamed without changes.

src/hooks/useLanguages.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@ import { LanguageType } from "../types";
22
import { useFetch } from "./useFetch";
33

44
export const useLanguages = () => {
5-
const { data, loading, error } = useFetch<LanguageType[]>("/data/index.json");
5+
const { data, loading, error } =
6+
useFetch<LanguageType[]>("/data/_index.json");
67

78
return { fetchedLanguages: data || [], loading, error };
89
};

0 commit comments

Comments
 (0)