Skip to content

Felopater-Melika/Astral-Store

Repository files navigation

Project Title

A dynamic e-commerce website powered by Next.js 13 and Redux, featuring server-side rendered products and persistent cart functionality.

Overview

This e-commerce application showcases modern development patterns and practices by integrating Next.js 13 and Redux. The website presents a smooth shopping experience, allowing users to browse server-side rendered products, add items to a cart, and manage their selections with ease.

One of the main highlights of this project is the use of the latest version of Next.js - Next.js 13. It introduces numerous innovative features, and in this application, it is used primarily for server-side rendering (SSR) of the products. SSR not only helps to improve the performance of the application by reducing the time to first meaningful paint, but it also enhances SEO capabilities, as the content is available on initial load.

Features

  • Server-Side Rendered (SSR) Products: Products are fetched server-side using Next.js 13's built-in data fetching methods. This ensures that the product data is ready at the time of HTML response, leading to faster page load times and a boost in SEO.

  • Persistent Shopping Cart: This application uses Redux for state management, providing a seamless shopping experience for users. The cart items are stored in local storage, making them persistent across browser sessions. Users can add items to the cart, remove them, and have their selections preserved when they return.

  • Tailwind CSS for Styling: This project utilizes Tailwind CSS for its styling - a highly customizable, utility-first CSS framework that is packed with features that can help you build modern designs.

  • Responsive Design: The website is fully responsive and ensures a smooth user experience on all device sizes.

Installation and Usage

  • Clone the repository: git clone https://github.com/yourusername/your-repository.git
  • Install the dependencies: npm install or yarn
  • Start the development server: npm run dev or yarn dev
  • Open http://localhost:3000 with your browser to see the result.

Final Thoughts

This e-commerce application is a testament to the power of modern web development tools like Next.js and Redux. With server-side rendered pages and a persistent shopping cart, it aims to provide a user experience that is smooth, fast, and enjoyable. It's a project I'm proud to showcase, and I believe it effectively demonstrates my current skills as a web developer.