Posts listing app has 2 pages (Home, Favorites) when we favorite a post it's added to localstorage. Designed to be mobile-first.
Check out the live demo on Vercel or Github Pages.
To run this project locally, follow these steps:
- Clone the repository:
git clone https://github.com/MarwaAbdelAal/Posts-Listing-App.git- Navigate to the project directory:
cd Posts-Listing-App- Install dependencies:
npm install- Start the development server:
npm run dev- Open your browser and visit http://localhost:3000.
To navigate through the application, use the Home and Favorites links in the navigation bar. The active link will be highlighted, and you can add posts to your favorites if you hit the heart icon on each post.
- Responsive UI: Pages adapts to different screen sizes and highlights the active link in the navigation bar.
- Loading Spinner: Displays a spinner while images are loading to enhance the user experience.
- Favorite Posts: Ability to favorite posts and persist this state using localStorage.
- Dynamic Content: Conditionally render content based on the active route and the loading state.
- Next.js v14.
- React v18.
- Sass for styling.
- React Icons.