Merge pull request #4 from vedantnn71/main

Refactor project structure, code and add npm modules to format code and run website locally
pushkaraj2007 · Sep 25, 2022 · ec5d053 · ec5d053 · vercel · Sep 25, 2022
2 parents 7e48f61 + fca2557
commit ec5d053
Show file tree

Hide file tree

Showing 14 changed files with 1,984 additions and 199 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1 @@
+node_modules
diff --git a/.prettierrc b/.prettierrc
@@ -0,0 +1,3 @@
+{
+  "singleQuote": true
+}
diff --git a/README.md b/README.md
@@ -1,12 +1,13 @@
 # TechCreators
+
 A website to list tech twitter creators, across the world.
 
 ## Languages/Tools
 
-
 <a href="https://developer.mozilla.org/en-US/docs/Glossary/HTML5" target="_blank" rel="noreferrer"><img src="https://raw.githubusercontent.com/danielcranney/readme-generator/main/public/icons/skills/html5-colored.svg" width="36" height="36" alt="HTML5" /></a>
 <a href="https://www.w3.org/TR/CSS/#css" target="_blank" rel="noreferrer"><img src="https://raw.githubusercontent.com/danielcranney/readme-generator/main/public/icons/skills/css3-colored.svg" width="36" height="36" alt="CSS3" /></a>
 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript" target="_blank" rel="noreferrer"><img src="https://raw.githubusercontent.com/danielcranney/readme-generator/main/public/icons/skills/javascript-colored.svg" width="36" height="36" alt="JavaScript" /></a>
+
 ## 👩🏽‍💻 Demo
 
 Check out the website: [TechCreators](https://techcreators.vercel.app)
@@ -23,13 +24,12 @@ Before installation, please make sure you have already installed the following t
 
 - Use these commands in your git bash to make a clone of the project in your pc.
 
-### SSH  [Github Docs](https://docs.github.com/en/authentication/connecting-to-github-with-ssh)
+### SSH [Github Docs](https://docs.github.com/en/authentication/connecting-to-github-with-ssh)
 
 ```bash
 $ git clone git@github.com:username/TechCreators
 ```
 
-
 ### GitHub CLI
 
 ```bash
@@ -42,7 +42,6 @@ $ gh repo clone username/TechCreators
 $ git clone https://github.com/username/TechCreators
 ```
 
-
 - Navigate to the project directory:
 
 ```bash
@@ -76,6 +75,14 @@ cd TechCreators
 - And finally create a [Pull Request](https://help.github.com/en/github/collaborating-with-issues-and-pull-requests/creating-a-pull-request)!
 - Great job! You did it!
 
+
+## 🚀 Running locally
+To run locally, just `cd` into the project and run the following commands to run node modules and serve the website locally.
+```bash
+npm i
+npm run start
+```
+
 ## 🛡️ License
 
 TechCreators is licensed under the MIT License - see the [LICENSE](Licence) file for details.
@@ -89,4 +96,3 @@ Thank you so much all for spending your time to improve TechCreators. Keep shini
 ## 🙏🏽 Support
 
 This project needs a star️ from you. Don't forget to leave a star 🌟
-
diff --git a/Images/github.png → assets/github.png b/Images/github.png → assets/github.png
diff --git a/Images/search.svg → assets/search.svg b/Images/search.svg → assets/search.svg
diff --git a/Images/twitter.png → assets/twitter.png b/Images/twitter.png → assets/twitter.png
diff --git a/index.html b/index.html
@@ -1,35 +1,38 @@
 <!DOCTYPE html>
 <html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>TechCreators</title>
-    <link rel="stylesheet" href="style.css">
-</head>
-<body>
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Tech Creators — Best tech twitter creators, across the world.</title>
+    <link rel="stylesheet" href="styles/index.css" />
+  </head>
+  <body>
     <nav>
-        <div></div>
-        <div class="input-div">
-            <img src="/Images/search.svg" alt="">
-            <input type="text" class="search-input" placeholder="Search for profile...">
-        </div>
+      <div></div>
+      <div class="input-div">
+        <img src="/assets/search.svg" alt="" />
+        <input
+          type="text"
+          class="search-input"
+          placeholder="Search for profile..."
+        />
+      </div>
 
-        <div class="img-div">
-            <a class="twitter-img" href="https://twitter.com/pushkaraj2007">
-                <img src="/Images/twitter.png" alt="">
-            </a>
+      <div class="img-div">
+        <a class="twitter-img" href="https://twitter.com/pushkaraj2007">
+          <img src="/assets/twitter.png" alt="" />
+        </a>
 
-            <a href="https://github.com/pushkaraj2007/TechCreators">
-                <img class="github-img" src="/Images/github.png" alt="">
-            </a>
-        </div>
+        <a href="https://github.com/pushkaraj2007/TechCreators">
+          <img class="github-img" src="/assets/github.png" alt="" />
+        </a>
+      </div>
     </nav>
-    <div class="container">
-        <div class="all-profiles-div">
 
-        </div>
+    <div class="container">
+      <div class="all-profiles-div"></div>
     </div>
-</body>
-    <script src="script.js"></script>
-</html>
+  </body>
+  <script src="scripts/app.js"></script>
+</html>