eshwar120 / Insta-feed-frontend

Insta Feed Frontend

This repository contains the frontend code for the Insta Feed web application. Insta Feed is a basic website where users can upload and view posts in a single place. The frontend is built using React.js, Toastify.js, React Router, HTML, and CSS.

Live site

https://insta-feed-mern.netlify.app/

Features

• User-friendly interface: The frontend provides a visually appealing and intuitive user interface for uploading and viewing posts.
• Post creation: Users can easily create and upload posts using the provided form.
• Post retrieval: All users can view all posts in a single place, creating a cohesive feed.

Technologies Used

• React.js: JavaScript library used for building user interfaces.
• Toastify.js: Library for displaying notifications and toasts in the application.
• React Router: Library for handling routing and navigation within the React application.
• HTML: Markup language used for structuring the web pages.
• CSS: Styling language used for enhancing the appearance of the web pages.

Prerequisites

• Node.js and npm: Make sure you have Node.js and npm installed on your system. You can download them from the official Node.js website.

Getting Started

1. Clone the repository:

   git clone https://github.com/your-username/insta-feed-frontend.git
   

2. Install dependencies:

   cd insta-feed-frontend
   npm install
   

3. Configuration:

   • Open the src/config.js file.
   • Adjust the configuration options according to your needs. You can modify variables such as API endpoints, Firebase credentials, etc.

4. Run the application:

   npm start
   

5. The application should now be running on http://localhost:3000. Open this URL in your web browser to access the Insta Feed website.

Usage

• Landing Page: Upon accessing the application, you will be presented with the landing page where you can see the "Enter" button.
• Feed Page: Click on the "Enter" button to navigate Feed page, you will be presented with the landing page where you can see all the posts uploaded by users.
• Create Post: Click on the "camera" icon to navigate to the post creation page. Fill in the required details and click "Post" to create a new post.

Acknowledgments

This project was developed as a basic web application using the mentioned technologies for educational purposes. It can be extended and customized as per your requirements.