├── .github
├── ISSUE_TEMPLATE
│ ├── bug_report.md
│ └── feature_request.md
└── pull_request_template.md
├── .gitignore
├── CODE_OF_CONDUCT.md
├── CONTRIBUTING.md
├── LICENSE
├── README.md
├── eslint.config.js
├── index.html
├── package-lock.json
├── package.json
├── postcss.config.js
├── public
├── assets
│ ├── mlsa-logo.png
│ └── react.svg
└── vite.svg
├── src
├── App.jsx
├── Layout.jsx
├── components
│ ├── BlogForm.jsx
│ ├── Button.jsx
│ ├── Footer.jsx
│ ├── HeroSection.jsx
│ ├── LoadMoreButton.jsx
│ ├── LoginForm.jsx
│ ├── NavBar.jsx
│ ├── PostCard.jsx
│ ├── PrivateRoute.jsx
│ ├── RecentPosts.jsx
│ ├── RegisterForm.jsx
│ ├── ScrollToTopButton.jsx
│ ├── TextEditor.jsx
│ ├── loader
│ │ ├── Loader.jsx
│ │ └── loader.css
│ └── svgs
│ │ ├── Address.jsx
│ │ ├── Email.jsx
│ │ ├── Facebook.jsx
│ │ ├── Fax.jsx
│ │ ├── Github.jsx
│ │ ├── Instagram.jsx
│ │ ├── Moon.jsx
│ │ ├── Phone.jsx
│ │ ├── SocialX.jsx
│ │ └── Sun.jsx
├── context
│ └── ThemeProvider.jsx
├── hooks
│ └── useFetch.js
├── index.css
├── main.jsx
└── pages
│ ├── CreateBlogs.jsx
│ ├── Home.jsx
│ ├── Login.jsx
│ ├── PageNotFound.jsx
│ └── Register.jsx
├── tailwind.config.js
└── vite.config.js
/.github/ISSUE_TEMPLATE/bug_report.md:
--------------------------------------------------------------------------------
1 | ---
2 | name: Bug report
3 | about: Create a report to help us improve
4 | title: ''
5 | labels: good first issue, hacktoberfest
6 | assignees: rycerzes, sohambuilds
7 |
8 | ---
9 |
10 | **Describe the bug**
11 | A clear and concise description of what the bug is.
12 |
13 | **To Reproduce**
14 | Steps to reproduce the behavior:
15 | 1. Go to '...'
16 | 2. Click on '....'
17 | 3. Scroll down to '....'
18 | 4. See error
19 |
20 | **Expected behavior**
21 | A clear and concise description of what you expected to happen.
22 |
23 | **Screenshots**
24 | If applicable, add screenshots to help explain your problem.
25 |
26 | **Desktop (please complete the following information):**
27 | - OS: [e.g. iOS]
28 | - Browser [e.g. chrome, safari]
29 | - Version [e.g. 22]
30 |
31 | **Smartphone (please complete the following information):**
32 | - Device: [e.g. iPhone6]
33 | - OS: [e.g. iOS8.1]
34 | - Browser [e.g. stock browser, safari]
35 | - Version [e.g. 22]
36 |
37 | **Additional context**
38 | Add any other context about the problem here.
39 |
--------------------------------------------------------------------------------
/.github/ISSUE_TEMPLATE/feature_request.md:
--------------------------------------------------------------------------------
1 | ---
2 | name: Feature request
3 | about: Suggest an idea for this project
4 | title: ''
5 | labels: enhancement, help wanted
6 | assignees: sohambuilds, rycerzes, SourasishBasu
7 |
8 | ---
9 |
10 | **Is your feature request related to a problem? Please describe.**
11 | A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
12 |
13 | **Describe the solution you'd like**
14 | A clear and concise description of what you want to happen.
15 |
16 | **Describe alternatives you've considered**
17 | A clear and concise description of any alternative solutions or features you've considered.
18 |
19 | **Additional context**
20 | Add any other context or screenshots about the feature request here.
21 |
--------------------------------------------------------------------------------
/.github/pull_request_template.md:
--------------------------------------------------------------------------------
1 | ## Description
2 |
3 | **Please include a summary of the change and which issue is fixed. Please also include relevant motivation and context. List any dependencies that are required for this change.**
4 |
5 | Fixes # (issue) *(only if applicable)*
6 |
7 | ### Type of Change
8 |
9 | Please delete options that are not relevant.
10 |
11 | - [ ] Bug fix (non-breaking change which fixes an issue)
12 | - [ ] New feature (non-breaking change which adds functionality)
13 | - [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
14 | - [ ] This change requires a documentation update
15 | - [ ] Other (please specify):
16 |
17 | ### Checklist:
18 |
19 | - [ ] My code follows the style guidelines of this project
20 | - [ ] I have performed a self-review of my own code
21 | - [ ] I have commented my code, particularly in hard-to-understand areas
22 | - [ ] I have made corresponding changes to the documentation
23 | - [ ] My changes generate no new warnings
24 | - [ ] New and existing unit tests pass locally with my changes
25 |
26 | ### Screenshots (if applicable)
27 |
28 | **Please include any relevant screenshots or images that help explain the changes made.**
29 |
30 | #### Additional Information
31 | - Name:
32 | - Email:
33 | - Roll No:
34 | - Branch:
35 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # Logs
2 | logs
3 | *.log
4 | npm-debug.log*
5 | yarn-debug.log*
6 | yarn-error.log*
7 | pnpm-debug.log*
8 | lerna-debug.log*
9 |
10 | node_modules
11 | dist
12 | dist-ssr
13 | *.local
14 |
15 | # Editor directories and files
16 | .vscode/*
17 | !.vscode/extensions.json
18 | .idea
19 | .DS_Store
20 | *.suo
21 | *.ntvs*
22 | *.njsproj
23 | *.sln
24 | *.sw?
25 |
--------------------------------------------------------------------------------
/CODE_OF_CONDUCT.md:
--------------------------------------------------------------------------------
1 | # MLSA KIIT Hacktoberfest: Stable Diffusion Fine-tuning Project Code of Conduct
2 |
3 | ## Our Pledge
4 |
5 | As members, contributors, and leaders of the MLSA KIIT community, we pledge to make participation in our Stable Diffusion fine-tuning project a positive and enriching experience for everyone. We aim to create an environment that fosters learning, innovation, and collaboration in the field of AI and machine learning.
6 |
7 | ## Our Standards
8 |
9 | Behaviors that contribute to a positive environment for our community include:
10 |
11 | * Sharing knowledge and assisting others in understanding Stable Diffusion and LoRA techniques
12 | * Respecting diverse approaches to model fine-tuning and image generation
13 | * Providing constructive feedback on others' fine-tuning results and generated images
14 | * Being open to learning from others' implementations and ideas
15 | * Focusing on the technical aspects of the project and maintaining a professional atmosphere
16 |
17 | Examples of unacceptable behavior include:
18 |
19 | * Using inappropriate language or imagery in code, documentation, or project communications
20 | * Trolling, insulting comments, or personal attacks, particularly regarding fine-tuning choices or results
21 | * Sharing or using datasets or generating images that could be considered harmful or unethical
22 | * Publishing others' private information, such as contact details or private model weights, without permission
23 | * Any conduct which could reasonably be considered inappropriate in an academic or professional setting
24 |
25 | ## Project-Specific Guidelines
26 |
27 | 1. Dataset Usage: Ensure you have the right to use and share any datasets used for fine-tuning.
28 | 2. Image Generation: Be mindful of the content you generate. Avoid creating or sharing inappropriate or offensive images.
29 | 3. Model Sharing: Only share LoRA weights, not entire fine-tuned models, to respect project guidelines.
30 | 4. Collaboration: Be open to collaboration and knowledge sharing about Stable Diffusion and LoRA techniques.
31 |
32 | ## Scope
33 |
34 | This Code of Conduct applies to all spaces related to the MLSA KIIT Hacktoberfest Stable Diffusion fine-tuning project, including GitHub repositories, discussion forums, and any project-related events.
35 |
36 | ## Enforcement
37 |
38 | Instances of abusive, harassing, or otherwise unacceptable behavior may be reported to the MLSA KIIT team responsible for enforcement at [MLSA KIIT Discord](https://discord.gg/DymVbhCmJf). All complaints will be reviewed and investigated promptly and fairly.
39 |
40 | ## Enforcement Guidelines
41 |
42 | MLSA KIIT community leaders will follow these Community Impact Guidelines in determining the consequences for any action they deem in violation of this Code of Conduct:
43 |
44 | 1. Correction: A private, written warning, providing clarity around the nature of the violation and an explanation of why the behavior was inappropriate.
45 |
46 | 2. Warning: A warning with consequences for continued behavior. No interaction with the people involved for a specified period of time.
47 |
48 | 3. Temporary Ban: A temporary ban from any sort of interaction or public communication with the community for a specified period of time.
49 |
50 | 4. Permanent Ban: A permanent ban from any sort of public interaction within the project community.
51 |
52 | ## Attribution
53 |
54 | This Code of Conduct is adapted from the Contributor Covenant, version 2.0, available at https://www.contributor-covenant.org/version/2/0/code_of_conduct.html.
55 |
56 | By participating in this project, you agree to abide by this Code of Conduct and the policies of MLSA KIIT.
--------------------------------------------------------------------------------
/CONTRIBUTING.md:
--------------------------------------------------------------------------------
1 | # Contributing to Stable Diffusion 1.4 Fine-tuning with LoRA
2 |
3 | Thank you for your interest in contributing to our Hacktoberfest project! This document outlines the process for contributing your own fine-tuned Stable Diffusion 1.4 model using LoRA.
4 |
5 | ## How to Contribute
6 |
7 | ### 1. Fork the Repository
8 |
9 | 1. Navigate to the main page of the repository on GitHub.
10 | 2. In the top-right corner of the page, click the "Fork" button.
11 | 3. Select your GitHub account as the destination for the fork.
12 | 4. Wait for GitHub to create a copy of the repository in your account.
13 |
14 | ### 2. Clone Your Fork
15 |
16 | 1. On your forked repository's page, click the "Code" button and copy the URL.
17 | 2. Open a terminal on your local machine and run:
18 | ```
19 | git clone https://github.com/your-username/repository-name.git
20 | cd repository-name
21 | ```
22 |
23 | ### 3. Create a New Branch
24 |
25 | Create a new branch for your contribution:
26 | ```
27 | git checkout -b your-concept-name
28 | ```
29 |
30 | ### 4. Implement Your Fine-tuning
31 |
32 | 1. Create a new folder in the root directory with your GitHub username or a unique identifier:
33 | ```
34 | mkdir your-username-concept
35 | cd your-username-concept
36 | ```
37 | 2. Implement your fine-tuning code within this folder. Include:
38 | - All necessary Python scripts for fine-tuning
39 | - A `requirements.txt` file if you use additional dependencies
40 |
41 | 3. Create a `concept.md` file in your folder describing the concept you chose for fine-tuning. Include:
42 | - A brief description of your concept
43 | - Any special techniques or modifications you made to the base code
44 | - Challenges you faced and how you overcame them
45 |
46 | 4. Provide a link to your fine-tuning dataset in the `concept.md` file. If the dataset is small enough, you can include it in your folder.
47 |
48 | 5. Create a `samples` folder within your concept folder and include at least 10 sample images generated using your fine-tuned model.
49 |
50 | 6. Export and save your LoRA weights:
51 | - After training, save only the LoRA weights (not the entire model)
52 | - Include a script or instructions for loading and applying these weights to the base SD 1.4 model
53 | - Name the weights file `lora_weights.pt` or similar
54 |
55 |
56 | ### 5. Commit and Push Your Changes
57 |
58 | 1. Stage your changes:
59 | ```
60 | git add .
61 | ```
62 | 2. Commit your changes:
63 | ```
64 | git commit -m "Add fine-tuned SD 1.4 model for [Your Concept]"
65 | ```
66 | 3. Push to your fork:
67 | ```
68 | git push origin your-concept-name
69 | ```
70 |
71 | ### 6. Create a Pull Request
72 |
73 | 1. Navigate to the original repository on GitHub.
74 | 2. Click on the "Pull requests" tab.
75 | 3. Click the "New pull request" button.
76 | 4. Click "compare across forks" and select your fork and branch.
77 | 5. Click "Create pull request".
78 | 6. Fill in the title and description of your pull request, explaining your changes.
79 | 7. Click "Create pull request" to submit.
80 |
81 | ## Project Structure and Your Contribution
82 |
83 | The current project structure looks like this:
84 |
85 | ```
86 | repository-root/
87 | ├── CONTRIBUTING.md
88 | ├── CODE_OF_CONDUCT.md
89 | ├── LICENSE
90 | ├── README.md
91 | ├── requirements.txt
92 | ├── src/ (Example implementation)
93 | │ ├── Dataset/
94 | │ │ ├── ImageCaptions/
95 | │ │ │ └── example1.txt
96 | │ │ └── Images/
97 | │ │ └── example1.png
98 | │ ├── dataset.py
99 | │ ├── generate.py
100 | │ ├── lora.py
101 | │ ├── main.py
102 | │ ├── train.py
103 | │ └── utils.py
104 | └── CONTRIBUTIONS/
105 | └── (This is where you'll add your folder)
106 | ```
107 |
108 | When adding your contribution:
109 |
110 | 1. Create a new folder inside the `CONTRIBUTIONS` directory. Name it with your GitHub username or a unique identifier for your concept:
111 |
112 | ```
113 | mkdir CONTRIBUTIONS/your-username-concept
114 | cd CONTRIBUTIONS/your-username-concept
115 | ```
116 |
117 | 2. Inside your folder, create the following structure:
118 |
119 | ```
120 | your-username-concept/
121 | ├── fine_tuning_script.py
122 | ├── other_necessary_scripts.py
123 | ├── requirements.txt (if you have additional dependencies)
124 | ├── concept.md
125 | ├── lora_weights.pt
126 | ├── load_lora_weights.py (or instructions in concept.md)
127 | └── samples/
128 | ├── sample1.png
129 | ├── sample2.png
130 | └── ... (at least 10 samples)
131 | ```
132 |
133 | 3. Implement your fine-tuning code, create your concept.md file, save your LoRA weights, and add your sample images as described in the previous sections.
134 |
135 | 4. When you're ready to submit, make sure your changes only affect files within your folder in the `CONTRIBUTIONS` directory.
136 |
137 |
138 |
139 | ## Guidelines for LoRA Weights
140 |
141 | - Save only the LoRA weights, not the entire fine-tuned model.
142 | - Provide clear instructions on how to apply these weights to the base SD 1.4 model.
143 | - Ensure the weights file is not too large (preferably under 100MB). If it's larger, consider uploading to a file sharing service and providing a link.
144 |
145 | ## Code of Conduct
146 |
147 | Please note that this project is released with a [Contributor Code of Conduct](CODE_OF_CONDUCT.md). By participating in this project you agree to abide by its terms.
148 |
149 | ## Questions?
150 |
151 | If you have any questions or need further clarification, please open an issue in the repository, and we'll be happy to help!
152 |
153 | Thank you for contributing to our Hacktoberfest project!
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2024 MLSAKIIT
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # DevBlogs Frontend
2 |
3 | ## Overview
4 |
5 | This is the frontend for DevBlogs, a Full Stack Blogging site for Developers by Developers. It's part of the MLSA HACKTOBER 2024: WEBDEV project.
6 |
7 | ## Tech Stack
8 |
9 | - React for dynamic user interfaces
10 | - Tailwind CSS for styling
11 | - Vite as the build tool
12 |
13 | ## Features
14 |
15 | 1. Complete user authentication with protected routes
16 | 2. Curated recommendations on homepage
17 | 3. Infinite scrolling layout
18 | 4. Responsive and modern UI
19 |
20 | ## Prerequisites
21 |
22 | - Node.js
23 | - npm or yarn
24 | - React
25 | - Tailwind CSS
26 | - React Hook Form / Yup
27 |
28 | ## Getting Started
29 |
30 | 1. Clone the repository to your local machine.
31 | 2. Navigate to the frontend directory of the project.
32 | 3. Install the required dependencies:
33 | ```
34 | npm install
35 | ```
36 | or
37 | ```
38 | yarn install
39 | ```
40 | 4. Start the development server:
41 | ```
42 | npm run dev
43 | ```
44 | or
45 | ```
46 | yarn dev
47 | ```
48 | 5. The frontend should now be running on a local port, typically http://localhost:5173.
49 |
50 | ## Folder Structure
51 |
52 | ```
53 | .
54 | ├── README.md
55 | ├── eslint.config.js
56 | ├── index.html
57 | ├── package.json
58 | ├── postcss.config.js
59 | ├── public/
60 | │ ├── assets/
61 | │ └── vite.svg
62 | ├── src/
63 | │ ├── App.jsx
64 | │ ├── components/
65 | │ ├── index.css
66 | │ ├── main.jsx
67 | │ └── pages/
68 | ├── tailwind.config.js
69 | └── vite.config.js
70 | ```
71 |
72 | ## Contributing
73 |
74 | We welcome contributions to improve this project! Here's how you can contribute:
75 |
76 | 1. Fork the repository
77 | 2. Create your feature branch (`git checkout -b feature/AmazingFeature`)
78 | 3. Commit your changes (`git commit -m 'Add some AmazingFeature'`)
79 | 4. Push to the branch (`git push origin feature/AmazingFeature`)
80 | 5. Open a Pull Request
81 |
82 | ## Issues & Features
83 | - Create and validate login and registration forms using `react-hook-form` and `yup`.
84 | - Fetch blogs and implement pagination.
85 | - Dark mode toggle with Tailwind CSS.
86 | - Rich text editor integration using `react-quill`.
87 | - Route protection for authenticated routes.
88 |
89 | Check the main project documentation for a list of current issues and tasks for the frontend.
90 |
91 | ## References
92 |
93 | - Form validation:
94 | - https://dev.to/franciscomendes10866/react-form-validation-with-react-hook-form-and-yup-4a98
95 | - https://www.youtube.com/watch?v=wlltgs5jmZw
96 | - Simple authentication:
97 | - https://dev.to/sanjayttg/jwt-authentication-in-react-with-react-router-1d03
98 | - https://www.tutorialspoint.com/localstorage-in-reactjs
99 | - Route protection:
100 | - https://medium.com/@dennisivy/creating-protected-routes-with-react-router-v6-2c4bbaf7bc1c
101 | - https://www.youtube.com/watch?v=pyfwQUc5Ssk
102 | - Dark mode:
103 | - https://mujeebkhan1831.medium.com/how-to-implement-darkmode-in-react-using-tailwind-css-3c47d009209a
104 | - https://www.youtube.com/watch?v=06IpGhvEtYg
105 | - 404 Page:
106 | - https://www.geeksforgeeks.org/how-to-setup-404-page-in-react-routing/
107 | - React-quill:
108 | - https://www.npmjs.com/package/react-quill
109 | - https://www.youtube.com/watch?v=ahNdQaq0mHg
110 | - https://www.youtube.com/watch?v=I3JQNq7Cbt0
111 | - Pagination:
112 | - https://www.youtube.com/watch?v=koG_UErY24I
113 | - React headers:
114 | - https://jasonwatmore.com/react-fetch-add-bearer-token-authorization-header-to-http-request
115 |
--------------------------------------------------------------------------------
/eslint.config.js:
--------------------------------------------------------------------------------
1 | import js from "@eslint/js";
2 | import globals from "globals";
3 | import react from "eslint-plugin-react";
4 | import reactHooks from "eslint-plugin-react-hooks";
5 | import reactRefresh from "eslint-plugin-react-refresh";
6 |
7 | export default [
8 | { ignores: ["dist"] },
9 | {
10 | files: ["**/*.{js,jsx}"],
11 | languageOptions: {
12 | ecmaVersion: 2020,
13 | globals: globals.browser,
14 | parserOptions: {
15 | ecmaVersion: "latest",
16 | ecmaFeatures: { jsx: true },
17 | sourceType: "module",
18 | },
19 | },
20 | settings: { react: { version: "18.3" } },
21 | plugins: {
22 | react,
23 | "react-hooks": reactHooks,
24 | "react-refresh": reactRefresh,
25 | },
26 | rules: {
27 | ...js.configs.recommended.rules,
28 | ...react.configs.recommended.rules,
29 | ...react.configs["jsx-runtime"].rules,
30 | ...reactHooks.configs.recommended.rules,
31 | "react/jsx-no-target-blank": "off",
32 | "react-refresh/only-export-components": [
33 | "warn",
34 | { allowConstantExport: true },
35 | ],
36 | "react/prop-types": "off", // Disable prop types validation
37 | },
38 | },
39 | ];
40 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |