https://github.com/mk4levi/students-card-react-app

A React App which renders list of all Students in Cards
https://github.com/mk4levi/students-card-react-app

bootstrap5 css3 html5 javascript jsx react-hooks react-router reactjs

Last synced: 3 months ago
JSON representation

A React App which renders list of all Students in Cards

• Host: GitHub
• URL: https://github.com/mk4levi/students-card-react-app
• Owner: Mk4Levi
• Created: 2023-05-20T08:33:18.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-08-10T14:49:13.000Z (5 months ago)
• Last Synced: 2024-10-07T09:23:09.596Z (3 months ago)
• Topics: bootstrap5, css3, html5, javascript, jsx, react-hooks, react-router, reactjs
• Language: JavaScript
• Homepage: https://students-card-react-app.vercel.app/
• Size: 164 KB
• Stars: 6
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Students-Card React-App

## Project's Link => https://students-card-react-app.vercel.app/

## # This is a React App which renders list of all the Students and fetch random images from unsplash-API to show it on the Student Card.

Getting Started


1. To get started with this project, you will need to have `Node.js` and `NPM` installed on your system.

2. First, you need to open a `Terminal` in your system and `Clone` this repository by using :

```bash

git clone https://github.com/Mk4Levi/Students-Card-React-App.git

```

3. Navigate to the Project's directory :

```bash

cd Students-Card-React-App

```

4. Install all Dependencies used in this Project :

```bash

npm install

```

5. Finally, host it on local server :

```bash

npm run dev

```

6. Now just search this in your browser to view the live running application in your Local sysytem :

```bash

http://localhost:5173

```

Paths & Files


### Structure of the Files in this Repo :

```text

.

├── public

│  └──images

├── src

│  ├── components

│     ├── Card.jsx

│     ├── Footer.jsx

│     ├── Header.jsx

│     ├── students-data.js

│  ├── css

│     ├── style.css

│  ├── App.jsx

│  ├── index.jsx

├── .gitattributes

├── .gitignore

├── index.html

├── package-lock.json

├── package.json

├── README.md

├── vite.config.js

```

# Thank You