Merge pull request #21 from CourseKrimson/dev/pageadd

add contributors page

Author: KrimsonSquad

.prettierrc

@@ -1,7 +1,6 @@
 {
-    "semi": true,
-    "singleQuote": true,
-    "tabWidth": 2,
-    "trailingComma": "es5"
-  }
-  
+  "semi": true,
+  "singleQuote": true,
+  "tabWidth": 2,
+  "trailingComma": "es5"
+}

CODE_OF_CONDUCT.md

@@ -17,23 +17,23 @@ diverse, inclusive, and healthy community.
 Examples of behavior that contributes to a positive environment for our
 community include:
 
-* Demonstrating empathy and kindness toward other people
-* Being respectful of differing opinions, viewpoints, and experiences
-* Giving and gracefully accepting constructive feedback
-* Accepting responsibility and apologizing to those affected by our mistakes,
+- Demonstrating empathy and kindness toward other people
+- Being respectful of differing opinions, viewpoints, and experiences
+- Giving and gracefully accepting constructive feedback
+- Accepting responsibility and apologizing to those affected by our mistakes,
   and learning from the experience
-* Focusing on what is best not just for us as individuals, but for the
+- Focusing on what is best not just for us as individuals, but for the
   overall community
 
 Examples of unacceptable behavior include:
 
-* The use of sexualized language or imagery, and sexual attention or
+- The use of sexualized language or imagery, and sexual attention or
   advances of any kind
-* Trolling, insulting or derogatory comments, and personal or political attacks
-* Public or private harassment
-* Publishing others' private information, such as a physical or email
+- Trolling, insulting or derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or email
   address, without their explicit permission
-* Other conduct which could reasonably be considered inappropriate in a
+- Other conduct which could reasonably be considered inappropriate in a
   professional setting
 
 ## Enforcement Responsibilities
@@ -106,7 +106,7 @@ Violating these terms may lead to a permanent ban.
 ### 4. Permanent Ban
 
 **Community Impact**: Demonstrating a pattern of violation of community
-standards, including sustained inappropriate behavior,  harassment of an
+standards, including sustained inappropriate behavior, harassment of an
 individual, or aggression toward or disparagement of classes of individuals.
 
 **Consequence**: A permanent ban from any sort of public interaction within

README.md

@@ -29,9 +29,11 @@
 git clone https://github.com/CourseKrimson/courseKrimson.github.io.git
 
 # Navigate to project folder
+
 cd courseKrimson.github.io
 
 # Install dependencies
+
 npm install
 </code></pre>
 

eslint.config.js

@@ -1,8 +1,8 @@
-import js from '@eslint/js'
-import globals from 'globals'
-import react from 'eslint-plugin-react'
-import reactHooks from 'eslint-plugin-react-hooks'
-import reactRefresh from 'eslint-plugin-react-refresh'
+import js from '@eslint/js';
+import globals from 'globals';
+import react from 'eslint-plugin-react';
+import reactHooks from 'eslint-plugin-react-hooks';
+import reactRefresh from 'eslint-plugin-react-refresh';
 
 export default [
   { ignores: ['dist'] },
@@ -35,4 +35,4 @@ export default [
       ],
     },
   },
-]
+];

index.html

@@ -5,29 +5,49 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Open Courses | KrimsonSquad</title>
-    <meta name="description" content="Explore a wide range of free courses in programming, frameworks, and development by KrimsonSquad." />
+    <meta
+      name="description"
+      content="Explore a wide range of free courses in programming, frameworks, and development by KrimsonSquad."
+    />
 
     <link rel="icon" type="image/png" href="/logo.png" />
 
     <meta property="og:title" content="Open Courses | KrimsonSquad" />
-    <meta property="og:description" content="Join us and explore a variety of open-source courses on programming and development by KrimsonSquad." />
-    <meta property="og:image" content="https://courses.krimsonsquad.tech/logo.png" />
+    <meta
+      property="og:description"
+      content="Join us and explore a variety of open-source courses on programming and development by KrimsonSquad."
+    />
+    <meta
+      property="og:image"
+      content="https://courses.krimsonsquad.tech/logo.png"
+    />
     <meta property="og:type" content="website" />
     <meta property="og:url" content="https://courses.krimsonsquad.tech" />
 
     <meta name="twitter:card" content="summary_large_image" />
     <meta name="twitter:title" content="Open Courses | KrimsonSquad" />
-    <meta name="twitter:description" content="Join KrimsonSquad's open-source learning platform with courses on programming, development, and more." />
-    <meta name="twitter:image" content="https://courses.krimsonsquad.tech/logo.png" />
+    <meta
+      name="twitter:description"
+      content="Join KrimsonSquad's open-source learning platform with courses on programming, development, and more."
+    />
+    <meta
+      name="twitter:image"
+      content="https://courses.krimsonsquad.tech/logo.png"
+    />
 
     <!-- Google AdSense -->
     <meta name="google-adsense-account" content="ca-pub-7045631665560122" />
 
-    <meta name="keywords" content="programming courses, KrimsonSquad, free coding courses, learn programming, development tutorials, open courses" />
+    <meta
+      name="keywords"
+      content="programming courses, KrimsonSquad, free coding courses, learn programming, development tutorials, open courses"
+    />
     <meta name="author" content="KrimsonSquad" />
     <meta name="robots" content="index, follow" />
-    <script src="https://kit.fontawesome.com/1364c3c233.js" crossorigin="anonymous"></script>
-
+    <script
+      src="https://kit.fontawesome.com/1364c3c233.js"
+      crossorigin="anonymous"
+    ></script>
   </head>
   <body>
     <div id="root"></div>

public/404.html

@@ -1,11 +1,13 @@
-<!DOCTYPE html>
+<!doctype html>
 <html>
   <head>
     <meta http-equiv="refresh" content="0; url=./index.html" />
-    <h2 style="color:red;font-family:monospace;"> Refreshing isn't supported by Host. Redirecting to Site...</h2>
+    <h2 style="color: red; font-family: monospace">
+      Refreshing isn't supported by Host. Redirecting to Site...
+    </h2>
     <script type="text/javascript">
       var pathname = window.location.pathname;
-      window.location.href = "/";
+      window.location.href = '/';
     </script>
   </head>
   <body></body>

public/courses/course1.md

@@ -1,36 +1,45 @@
 # This course covers:
-   - Installing and configuring OH MY ZSH
-   - Customizing ZSH themes and plugins
-   - Productivity tips for terminal users
+
+- Installing and configuring OH MY ZSH
+- Customizing ZSH themes and plugins
+- Productivity tips for terminal users
 
 ## Requirements
-   - Familiar with Bash, Terminal & Commands
+
+- Familiar with Bash, Terminal & Commands
 
 ### What is Zsh?
-   <q>Zsh or Zshell is an enhanced, improved, and extended version of BASH (Bourne Again Shell).</q>
+
+<q>Zsh or Zshell is an enhanced, improved, and extended version of BASH (Bourne Again Shell).</q>
 
 ### Why Oh My Zsh?
-   <code>Oh My Zsh</code> is an open-source framework used to customize zsh as well as manage its configs.
+
+<code>Oh My Zsh</code> is an open-source framework used to customize zsh as well as manage its configs.
 
 ## Steps Performed:
---- 
+
+---
 
 ### ZSH Installation
+
 Installation may differ according to your OS. [See here](https://github.com/ohmyzsh/ohmyzsh/wiki/Installing-ZSH)
 
 **For Ubuntu**: <code>$ sudo apt install zsh</code>
 
 ### Oh-My-Zsh Installation
+
 Install **Oh-My-Zsh** according to your OS or distro. [See here](https://ohmyz.sh/#install)
 
 **For Ubuntu**: <code>$ sh -c $(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)</code>
 
 ### Zsh Configuration
+
 ![Screenshot of Oh-My-Zsh](https://uploads.sitepoint.com/wp-content/uploads/2019/11/1573134240zsh-02.png)
 
 Boom! Now, your .zshrc <i>(source file for zshell launch)</i> has been replaced by a new .zshrc file <i>(in your home dir or where you've installed it)</i>. The original .zshrc is kept as a backup file.
 
 #### Themes
+
 The first thing I'd ever do is to change my terminal theme as I like. So, let's explore what will suit us?
 **Editing <q>.zshrc</q> file**
 Go to <code>~</code> <i>(home dir or where you've installed it)</i>
@@ -39,10 +48,11 @@ Choose your favorite editor and edit the **.zshrc** file.
 I performed: <code>$ nano .zshrc</code>
 To change the theme you need to change the value of <q>ZSH_THEME</q>.
 For exploring themes, I placed <q>random</q>. So that, it will launch with any random theme at every instance.
-If you've chosen one, just edit ~/.zshrc file and change the value of <q>ZSH_THEME</q> with the theme you want. 
+If you've chosen one, just edit ~/.zshrc file and change the value of <q>ZSH_THEME</q> with the theme you want.
 I changed <code>ZSH_THEME="devcontainers"</code> to <code>ZSH_THEME="fino"</code>.
 
 #### Auto-Suggestions
+
 This plugin suggests commands based on your past history, saving you both effort and time.
 **Installing <q>Auto-Suggestions</q> plugin**
 Clone GitHub repository to install it: <code>git clone https://github.com/zsh-users/zsh-autosuggestions ~/.oh-my-zsh/custom/plugins/zsh-autosuggestions</code>.

public/courses/course2.md

@@ -1,5 +1,4 @@
-  A <code>command line interface (CLI)</code> is a text-based user interface used to interact with a computer system. 
-    It uses commands to perform tasks, such as creating files or installing programs. 
-    CLIs are useful for automation and troubleshooting, and they can be more efficient than graphical user interfaces (GUIs) for certain tasks. 
-    They were commonly used in the past with systems like Unix, MS-DOS, and Apple DOS, and are still used today by software developers and system administrators.
-    
+A <code>command line interface (CLI)</code> is a text-based user interface used to interact with a computer system.
+It uses commands to perform tasks, such as creating files or installing programs.
+CLIs are useful for automation and troubleshooting, and they can be more efficient than graphical user interfaces (GUIs) for certain tasks.
+They were commonly used in the past with systems like Unix, MS-DOS, and Apple DOS, and are still used today by software developers and system administrators.

src/App.jsx

@@ -1,25 +1,26 @@
-import { useEffect, useState } from "react";
-import "./styles/App.css";
-import "./styles/index.css";
+import { useEffect, useState } from 'react';
+import './styles/App.css';
+import './styles/index.css';
 import {
   BrowserRouter as Router,
   Routes,
   Route,
   Navigate,
-} from "react-router-dom";
-import SearchResults from "./pages/Search";
-import Login from "./pages/Login";
-import SignUp from "./pages/Register";
-import Home from "./pages/Home";
-import Profile from "./pages/Profile";
-import { ToastContainer } from "react-toastify";
-import "react-toastify/dist/ReactToastify.css";
-import { auth } from "./services/firebase";
-import Navbar from "./components/Navbar";
-import CourseDetail from "./pages/CourseDetail";
-import Dashboard from "./pages/Dashboard";
-import courses from "./data/courseData";
-import Footer from "./components/Footer";
+} from 'react-router-dom';
+import SearchResults from './pages/Search';
+import Login from './pages/Login';
+import SignUp from './pages/Register';
+import Home from './pages/Home';
+import Profile from './pages/Profile';
+import { ToastContainer } from 'react-toastify';
+import 'react-toastify/dist/ReactToastify.css';
+import { auth } from './services/firebase';
+import Navbar from './components/Navbar';
+import CourseDetail from './pages/CourseDetail';
+import Dashboard from './pages/Dashboard';
+import courses from './data/courseData';
+import Footer from './components/Footer';
+import Contributors from './pages/GithubFetch';
 
 function App() {
   const [user, setUser] = useState(null);
@@ -47,7 +48,7 @@ function App() {
     <Router basename={import.meta.env.BASE_URL}>
       {/* <RedirectWithState /> */}
       <div className="App">
-        <Navbar loggedin={user ? "true" : "false"} />
+        <Navbar loggedin={user ? 'true' : 'false'} />
         <div className="auth-wrapper">
           <div className="auth-inner">
             <Routes>
@@ -68,6 +69,7 @@ function App() {
               <Route path="/courses/:courseName" element={<CourseDetail />} />
               <Route path="/" element={<Dashboard courses={courses} />} />
               <Route path="/search" element={<SearchResults />} />
+              <Route path="/contributors" element={<Contributors />}></Route>
             </Routes>
             <ToastContainer />
           </div>

src/components/Footer.jsx

@@ -6,21 +6,25 @@ export default function Footer() {
 
   return (
     <footer className=" text-center text-lg-start align-items-center fixed-bottom">
-    
       <div className="d-flex justify-content-between p-3">
-       
         <button className="btn btn-secondary" onClick={() => navigate(-1)}>
           <i className="fa-solid fa-circle-left"></i> back
         </button>
-        <div className="text-center p-3" style={{ backgroundColor: 'rgba(0, 0, 0, 0.05)' }}>
-          © <a className="text-body" href="https://krimsonsquad.tech/">Krimsonsquad.tech</a> 2024
+        <div
+          className="text-center p-3"
+          style={{ backgroundColor: 'rgba(0, 0, 0, 0.05)' }}
+        >
+          ©{' '}
+          <a className="text-body" href="https://krimsonsquad.tech/">
+            Krimsonsquad.tech
+          </a>{' '}
+          2024
         </div>
         {/* Forward Button - Right Side */}
         <button className="btn btn-secondary" onClick={() => navigate(1)}>
           <i className="fa-solid fa-circle-right"></i> forward
         </button>
       </div>
-
     </footer>
   );
 }