Skip to content

HamzaZaidiX/Nike-Landing-Page

Repository files navigation

Nike Landing Page with React.js and Tailwind CSS 🏃‍♂️🥾

This is a simple Nike landing page built using React.js and Tailwind CSS. The project aims to demonstrate the use of these technologies to create a responsive and visually appealing website.

Table of Contents

Project Overview

**The Nike website clone is a simple React.js application that showcases a collection of shoes. It includes a header with a logo, navigation links, and a search bar. The main content area displays a grid of shoe cards, each with a thumbnail image and a clickable area to view a larger image. The footer contains social media icons and a copyright notice. **

Features

  • Responsive design using Tailwind CSS
  • Shoe card component with thumbnail and larger image view
  • Header with logo, navigation links, and search bar
  • Footer with social media icons and copyright notice

Installation

To set up the project, follow these steps:

  1. Clone the repository:

    git clone https://github.com/HamzaZaidiX/Nike-Landing-Page.git
    
  2. Navigate to the project directory:

    cd Nike-Landing-Page
    
  3. Install dependencies:

    npm install
    
  4. Start the development server:

    npm start
    

Usage

Once the project is set up and running, you can access the website at http://localhost:3000. The shoe cards will display the thumbnail images of the shoes. Clicking on a shoe card will open a larger image in a modal.

Screenshots

image

Materials Used

  • React.js: A JavaScript library for building user interfaces
  • Tailwind CSS: A utility-first CSS framework for rapidly building custom designs
  • Font Awesome: A popular icon set and toolkit

Contributing

If you'd like to contribute to this project, please feel free to submit a pull request. I'm always open to suggestions and improvements.

License

This project is licensed under the MIT License. See the LICENSE file for more information.

Acknowledgments