Skip to content

Advice Generator App built using React and SCSS, following the BEM (Block Element Modifier) naming convention. It is created as a solution to the Frontend Mentor challenge.

License

Notifications You must be signed in to change notification settings

OmPreetham/advice-generator-app

Repository files navigation

Advice Generator App

This project is a simple advice generator app built using React and SCSS, following the BEM (Block Element Modifier) naming convention. It is created as a solution to the Frontend Mentor challenge.

Features

  • Generates random advice fetched from the Advice Slip JSON API.
  • Responsive design for mobile, tablet, and desktop.
  • SCSS for styling, organized with BEM naming convention.
  • Built with Vite for fast development and bundling.

Technologies Used

  • React
  • SCSS (Sass)
  • Vite (Frontend build tool)
  • HTML
  • JavaScript

Previews

Desktop

Desktop Preview

Mobile

Mobile Preview

Getting Started

Follow these instructions to get a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites

Make sure you have Node.js and npm (or yarn) installed on your machine.

Installation

  1. Clone this repository to your local machine using the following command:

    git clone https://github.com/OmPreetham/advice-generator-app.git
    
  2. Navigate into the project directory:

    cd advice-generator-app
    
  3. Install dependencies using npm:

    npm install
    

Usage

To run the project, use the following command:

npm run dev

This will start a development server and open the project in your default web browser. Any changes you make to the source code will be hot-reloaded, meaning you can see the updates in real-time.

Build

To build the project for production, use the following command:

npm run build

This will start a development server and open the project in your default web browser. Any changes you make to the source code will be hot-reloaded, meaning you can see the updates in real-time.

Build

To build the project for production, use the following command:

This will create an optimized build of the project in the dist directory.

Additional Information

  • This project was scaffolded using Vite, a blazing fast frontend build tool.
  • It uses React for building the user interface.
  • Feel free to customize the project according to your needs.

License

This project is licensed under the MIT License.