Merge pull request #132 from Web-Dev-Path/feature/husky-precommit

Implement husky pre-commit

Author: cherylli

.husky/pre-commit

@@ -0,0 +1,7 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+exec >/dev/tty 2>&1
+
+npx lint-staged
+

.prettierignore

@@ -0,0 +1,2 @@
+.next
+public

.prettierrc

@@ -1,5 +1,6 @@
 {
   "singleQuote": true,
   "jsxSingleQuote": true,
-  "arrowParens": "avoid"
+  "arrowParens": "avoid",
+  "endOfLine": "auto"
 }

.vscode/settings.json

@@ -1,3 +1,3 @@
 {
   "git.ignoreLimitWarning": true
-}
+}

CHANGELOG.md

@@ -48,6 +48,10 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 - About page content (first section)
 - About page "Wanna Learn More" and "How to get started?" section
 - An optional second column to TwoColumn instead of the image
+- .prettierignore file
+- husky, lint-staged to auto format with prettier on git commit
+- lint and format script to run prettier check and write on all files respectively
+
 
 ### Fixed
 
@@ -62,3 +66,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 - updated 'about us' section (our goals, our purpose)
 - updated mobile nav to automatically close when page route change is completed
 - adjust flex-basis of a few sections in the about page to better match the design file
+- prettierrc "end of line" to auto
+
+
+

components/layout/Nav.js

@@ -41,17 +41,16 @@ export default function Nav() {
 
   useEffect(() => {
     const handleRouteChange = () => {
-      setActive(false)
-    }
+      setActive(false);
+    };
 
-    router.events.on('routeChangeComplete', handleRouteChange)
+    router.events.on('routeChangeComplete', handleRouteChange);
 
     return () => {
-      router.events.off('routeChangeComplete', handleRouteChange)
-    }
+      router.events.off('routeChangeComplete', handleRouteChange);
+    };
   }, []);
 
-
   return (
     <header className={styles.header} ref={headerRef}>
       <Container>

jsconfig.json

@@ -5,7 +5,7 @@
       "@/components/*": ["components/*"],
       "@/styles/*": ["styles/*"],
       "@/hooks/*": ["hooks/*"],
-      "@/utils/*": ["utils/*"],
+      "@/utils/*": ["utils/*"]
     }
   }
-}
+}

package.json

@@ -8,7 +8,15 @@
     "open-browser-win": "start http://localhost:3010",
     "open-browser-mac": "open http://localhost:3010",
     "build": "next build",
-    "start": "next start"
+    "start": "next start",
+    "lint": "prettier --check .",
+    "format": "prettier --write .",
+    "prepare": "husky install"
+  },
+  "lint-staged": {
+    "**/*.{js,jsx,ts,tsx,scss}": [
+      "prettier --write"
+    ]
   },
   "dependencies": {
     "html-entities": "^2.3.2",
@@ -20,5 +28,11 @@
     "react-mailchimp-subscribe": "^2.1.3",
     "sass": "^1.35.1",
     "swiper": "^8.2.2"
+  },
+  "devDependencies": {
+    "husky": "^8.0.0",
+    "lint-staged": "^13.0.3",
+    "prettier": "^2.7.1",
+    "prettylint": "^1.0.0"
   }
 }

styles/CardsColumns.module.scss

@@ -18,9 +18,4 @@
   :global(.swiper-pagination-bullet-active) {
     background-color: $dark-bg-color;
   }
-
 }
-
-
-
-

styles/Container.module.scss

@@ -5,4 +5,3 @@
   width: 90%;
   max-width: $large-desktop-breakpoint;
 }
-