Horoscope App

Horoscope Page Live

Description

The project aims to create a bushing application. In the project, the horoscopes are displayed and their expected status according to the relevant date is reflected.

Project Skeleton

Horoscope App(folder)
|
|----node-modules       
|
├── public
│     └── index.html
├── src
│    ├── components
│    │       ├── card
│    │       │     ├── Card.jsx
│    │       │     └── Card.scss
│    │       ├── main
│    │       │     ├── Main.jsx
│    │       │     └── Main.scss
│    │       └── navbar
│    │             ├── Navbar.jsx
│    │             └── Navbar.scss
│    ├── helper
│    │       └── data.js
|    ├── img   
|    |     └── logo.png
|    ├── scss
|    |      ├── _reset.scss
|    |      └── _variable.scss
│    ├── App.js
│    ├── App.scss
│    └── index.js
│
├── .gitignore
├── package-lock.json
├── package.json
└── README.md

Outcome

Objective

Build a Horoscope App using ReactJS.

At the end of the project, following topics are to be covered;

• HTML

• CSS-SCSS

• JS

• ReactJS

Steps to Solution

• Step 1: Create React App using npx create-react-app horoscope

• Step 2: Build horoscope app using data.js.