Merge pull request #305 from Web-Dev-Path/chore/release-v1-5-0

chore: Release v1.5.0

Author: oluwatobiss

.nvmrc

@@ -1 +1 @@
-20.18.0
+22

CHANGELOG.md

@@ -143,7 +143,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 - Resolved `fetchPriority` prop warning in next/image
 - Updated sendgridEmail to support@webdevpath.co
 
-## Unreleased
+## 1.5.0
 
 ### Added
 
@@ -155,6 +155,11 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 - Added Oluwatobi to 'about us'
 - Updated Satoshi's profile links
 - Added Damilola to 'about us'
+- Updated Next.js from v15.5.14 to v15.5.19 and other outdated dependencies
+- Updated Damilola's profile image format from jpg to webp
+- Updated Oluwatobi's profile
+- Added `sizes` prop to images with `fill` to improve page performance
+- Update supported Node.js version from 20.18.0 to 22
 
 ### Fixed
 
@@ -220,3 +225,13 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 - Removed unused props from Hero layout component
 - Replace sendgrid with mailjet for sending contact email
 - Replace mailto:hello@webdevpath.co button links with /contact
+- Removed next-pwa implementation
+- Removed redundant styledComponents configuration
+
+## Unreleased
+
+### Added
+
+### Fixed
+
+### Changed

components/blog/AuthorBio/index.js

@@ -8,7 +8,12 @@ export default function AuthorBio({ user }) {
         <h3>Author Bio</h3>
         <div className={styles['flex-container']}>
           <div className={styles['image-wrapper']}>
-            <Image src={user.profile_image} alt="Author's profile" fill />
+            <Image
+              src={user.profile_image}
+              alt="Author's profile"
+              fill
+              sizes='(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw'
+            />
           </div>
           <div className={styles['split-container']}>
             <p>{user.summary}</p>

components/blog/PostContent/index.js

@@ -12,7 +12,12 @@ export default function PostContent({ post }) {
       >{`${post.user.name}\u00A0\u00A0\u00A0${publishedDate}`}</p>
       {post.cover_image && (
         <div className={styles.imageWrapper}>
-          <Image src={post.cover_image} alt='Blog post cover' fill />
+          <Image
+            src={post.cover_image}
+            alt='Blog post cover'
+            fill
+            sizes='(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw'
+          />
         </div>
       )}
       <div className={styles.contentContainer}>

components/containers/Card/index.js

@@ -18,7 +18,13 @@ export function Card({ card, cardType = 'default' }) {
     <div className={`${styles.card} ${styles[`card--${cardType}`] || ''}`}>
       {image && (
         <div className={styles.imageWrapper}>
-          <Image className={styles.cardImage} src={image} alt={altTag} fill />
+          <Image
+            className={styles.cardImage}
+            src={image}
+            alt={altTag}
+            fill
+            sizes='(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw'
+          />
         </div>
       )}
 

components/containers/Member/index.js

@@ -14,7 +14,12 @@ export default function Member({
     <div className={styles.card}>
       {image && (
         <div className={styles.imageWrapper}>
-          <Image src={image} alt={name} fill />
+          <Image
+            src={image}
+            alt={name}
+            fill
+            sizes='(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw'
+          />
         </div>
       )}
 

components/containers/TwoColumn/index.js

@@ -52,7 +52,13 @@ export default function TwoColumn({
         {secondTextColumn ||
           (image && (
             <div className={styles.inner__image}>
-              <Image className={styles.img} src={image} alt={altTag} fill />
+              <Image
+                className={styles.img}
+                src={image}
+                alt={altTag}
+                fill
+                sizes='(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw'
+              />
             </div>
           ))}
       </Container>

components/layout/Hero/index.js

@@ -28,6 +28,7 @@ export default function Hero({
         alt={imgAlt}
         fill
         priority
+        sizes='(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw'
       />
       <Container className={styles.headerContent}>
         <div className={styles.headerContentUpper}>

next.config.js

@@ -1,18 +1,5 @@
-const withPWA = require('next-pwa');
-
-module.exports = withPWA({
-  pwa: {
-    dest: 'public',
-    register: true,
-    skipWaiting: true,
-    disable: process.env.NODE_ENV === 'development',
-  },
-  compiler: {
-    styledComponents: {
-      ssr: true,
-      cssProp: true,
-    },
-  },
+/** @type {import('next').NextConfig} */
+const nextConfig = {
   i18n: {
     locales: ['en'],
     defaultLocale: 'en',
@@ -29,4 +16,6 @@ module.exports = withPWA({
       },
     ],
   },
-});
+};
+
+module.exports = nextConfig;

package.json

@@ -1,6 +1,6 @@
 {
   "name": "web-dev-path",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "private": true,
   "scripts": {
     "dev": "yarn run open-browser-win && next dev -p 3010",
@@ -19,26 +19,26 @@
     ]
   },
   "dependencies": {
-    "@hookform/resolvers": "^5.2.2",
-    "@sendgrid/mail": "^8.1.5",
+    "@hookform/resolvers": "^5.4.0",
+    "@sendgrid/mail": "^8.1.6",
     "html-entities": "^2.3.2",
-    "next": "^15.5.14",
-    "next-pwa": "^2.0.2",
+    "next": "15.5.19",
     "node-mailjet": "^6.0.9",
-    "react": "19.1.0",
-    "react-dom": "19.1.0",
+    "react": "19.2.7",
+    "react-dom": "19.2.7",
     "react-google-recaptcha": "^3.1.0",
-    "react-hook-form": "^7.35.0",
-    "sass": "^1.35.1",
-    "swiper": "^12.1.3",
-    "zod": "^4.3.6"
+    "react-hook-form": "^7.78.0",
+    "sass": "^1.100.0",
+    "swiper": "^12.2.0",
+    "zod": "^4.4.3"
   },
   "devDependencies": {
     "husky": "^9.1.7",
-    "lint-staged": "^16.0.0",
-    "prettier": "^3.5.3",
+    "lint-staged": "^17.0.7",
+    "prettier": "^3.8.4",
     "prettylint": "^2.0.0",
-    "webpack": "^5.88.1"
+    "webpack": "^5.107.2",
+    "yaml": "^2.9.0"
   },
   "license": "GPL-3.0",
   "packageManager": "yarn@1.22.21+sha1.1959a18351b811cdeedbd484a8f86c3cc3bbaf72"