Pictopia

Overview

Pictopia is a web application inspired by Pinterest, providing users with a platform to discover, save, and comment on inspiring images. Built using React and JavaScript, Pictopia allows users to create collections, browse through a wide variety of images, and engage with the community through comments. The application uses Sanity as the backend for data storage and management.

The deployed application can be accessed at https://pictopiaaa.netlify.app/.

Features

• User Authentication: Pictopia includes a user authentication system that enables users to create accounts, log in, and securely access their profiles.
• Responsive Design: The application is designed to be responsive, ensuring an optimal viewing experience across different screen sizes and devices.
• Image Collections: Users can create collections and save images of interest to these collections for future reference.
• Image Discovery: Pictopia offers a wide range of images for users to browse and discover new inspirations.
• Comments: Users can leave comments on images, fostering engagement and interaction within the community.
• User Profiles: Each user has a dedicated profile page where others can explore the collections they have created and the images they have saved.
• Categorized Images: Pictopia organizes images into various categories, making it easy for users to explore specific content genres.
• Search Functionality: The application features a search bar that allows users to search for specific images or content categories.

Tech Stack

• Frontend: Pictopia is built using React, a popular JavaScript library for building user interfaces.
• Backend: For data storage and management, the application utilizes Sanity, a flexible and customizable headless CMS (Content Management System).
• State Management: Pictopia utilizes state management techniques provided by React to manage and update the application's state efficiently.
• Authentication: The user authentication system is implemented using libraries and frameworks compatible with React and Sanity.

Setup and Usage

To access and use Pictopia, you can visit the deployed application at https://pictopiaaa.netlify.app/.

If you prefer to set up and run Pictopia on your local machine, follow these steps:

1. Clone the repository:

   git clone https://github.com/shubhjhawar/pictopia.git
   

2. Install dependencies:

   cd pictopia
   npm install
   

3. Configure environment variables:

   • Create a .env.local file in the root directory.
   • Add the necessary environment variables, such as API keys and configuration details, to the file.

4. Start the development server:

   npm start
   

5. Access Pictopia in your browser at http://localhost:3000.

Contributing

Contributions to Pictopia are welcome! If you'd like to contribute to the project, please follow these guidelines:

• Fork the repository and create a new branch for your feature or bug fix.
• Commit your changes with descriptive commit messages.
• Push your branch to your forked repository.
• Open a pull request, explaining the purpose and changes of your contribution.

Contact

If you have any questions or suggestions regarding Pictopia, feel free to reach out to us at [email protected].

Thank you for using Pictopia! We hope you enjoy discovering and saving inspiring images on our platform.