From 5460ea2da452a674cd8cf60a752ac8c7ac2befda Mon Sep 17 00:00:00 2001 From: Dereje Getahun Date: Fri, 14 Jun 2024 10:29:17 +0300 Subject: [PATCH] Update README.md --- README.md | 196 ++++++++++++++++++++++++++++++------------------------ 1 file changed, 110 insertions(+), 86 deletions(-) diff --git a/README.md b/README.md index ac13f5e0..5ba0d6d9 100644 --- a/README.md +++ b/README.md @@ -1,133 +1,157 @@ # Pinterest-Clone + [![codecov](https://codecov.io/gh/Dereje1/Pinterest-Clone/branch/master/graph/badge.svg?token=k3bnvXaDh3)](https://codecov.io/gh/Dereje1/Pinterest-Clone) + ### A clone of the Pinterest application for educational purposes -https://pinterest-clone-oct6.onrender.com/ -#### Use the app to generate images using a web link, upload your own images, or use OpenAI’s cutting-edge image generation technology. +Explore the live application: [Pinterest-Clone](https://pinterest-clone-oct6.onrender.com/) + +Use the app to generate images using a web link, upload your own images, or use OpenAI’s cutting-edge image generation technology. -![Screenshot (45)](https://github.com/Dereje1/Pinterest-Clone/assets/23533048/e5849734-ec10-4a32-ba0b-1230a8cfb489) +![Screenshot](https://github.com/Dereje1/Pinterest-Clone/assets/23533048/e5849734-ec10-4a32-ba0b-1230a8cfb489) -# Getting Started -## A) Local -These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. +## Getting Started -### Tools +These instructions will help you get a copy of the project up and running on your local machine for development and testing purposes. -#### Prerequisites +### Prerequisites -| Tool | Version | -|---------------------------------------------|--------------------| -| [Node.js](https://nodejs.org/) / npm | ~18.3.0 / ~8.19.3 | -| [Git](https://git-scm.com/) | ~2 | +Ensure you have the following tools installed: -#### Optional +| Tool | Version | +|--------------------------------------------|-----------| +| [Node.js](https://nodejs.org/) / npm | ~18.3.0 / ~8.19.3 | +| [Git](https://git-scm.com/) | ~2 | -| Tool | Version | -|---------------------------------------------|--------------------| -| [Docker Desktop](https://www.docker.com/products/docker-desktop) | ~4.4.2 | -| [MongoDB Compass](https://www.mongodb.com/products/compass) | ~1.0.0 | +Optional tools: +| Tool | Version | +|--------------------------------------------|-----------| +| [Docker Desktop](https://www.docker.com/products/docker-desktop) | ~4.4.2 | +| [MongoDB Compass](https://www.mongodb.com/products/compass) | ~1.0.0 | ### Installing ->Create a new directory and initialize git +1. **Create a new directory and initialize Git:** -``` -mkdir Pinterest-Clone -cd Pinterest-Clone -git init -``` ->Pull from github and install packages + ```sh + mkdir Pinterest-Clone + cd Pinterest-Clone + git init + ``` -``` -git pull https://github.com/Dereje1/Pinterest-Clone.git +2. **Clone the repository and install packages:** -npm install -``` + ```sh + git pull https://github.com/Dereje1/Pinterest-Clone.git + npm install + ``` ->To run mongoDB locally with docker : +3. **Run MongoDB locally with Docker:** -In the root folder run -``` -docker-compose up mongodb -``` -Alternatively, you can get a connection string from mongodb Atlas after setting up your own db. + In the root folder, run: ->create .env files + ```sh + docker-compose up mongodb + ``` -In the root of the project create a .env file with the following contents -``` + Alternatively, you can get a connection string from MongoDB Atlas after setting up your own database. -SESSION_SECRET= -MONGOLAB_URI=mongodb://root:123456@localhost:27017 -TWITTER_CONSUMER_KEY=< Get from Twitter Developer API > -TWITTER_CONSUMER_SECRET=< Get from Twitter Developer API > -TWITTER_CALLBACK=http://localhost:8080/auth/twitter/redirect -GOOGLE_CLIENT_ID=< Get from Google Developer API > -GOOGLE_CLIENT_SECRET=< Get from Google Developer API > -GOOGLE_CALLBACK=http://localhost:8080/auth/google/redirect -GITHUB_CLIENT_ID=< Get from Github Developer API > -GITHUB_CLIENT_SECRET=< Get from Github Developer API > -GITHUB_CALLBACK=http://localhost:8080/auth/github/redirect -AWS_ACCESS_KEY_ID=< Get from AWS > -AWS_SECRET_KEY=< Get from AWS > -S3_BUCKET_NAME=< s3 bucket name for uploaded pins> -NODE_ENV= -DEBUG=Pinterest-Clone:server -DEBUG_COLORS=1 -GOOGLE_APPLICATION_CREDENTIALS=< service account key path for cloud vision api > -OPENAI_API_KEY= -``` -Run the development environment -``` -npm run dev -``` -You can now go to `http://localhost:8080/` and see the project running in dev mode. +4. **Create `.env` file:** -## B) Docker -If you have docker installed and a `.env` file with contents from above, then from the root dir: -1. Build and run the images -``` -docker-compose up -``` -2. Go to `http://localhost:8080/` -* Note: MONGOLAB_URI is already incorporated in the local docker setup and is not needed for your env file if fully running with docker. -
+ In the root of the project, create a `.env` file with the following contents: -# Testing & Build -## Testing -``` + ```env + SESSION_SECRET= + MONGOLAB_URI=mongodb://root:123456@localhost:27017 + TWITTER_CONSUMER_KEY=< Get from Twitter Developer API > + TWITTER_CONSUMER_SECRET=< Get from Twitter Developer API > + TWITTER_CALLBACK=http://localhost:8080/auth/twitter/redirect + GOOGLE_CLIENT_ID=< Get from Google Developer API > + GOOGLE_CLIENT_SECRET=< Get from Google Developer API > + GOOGLE_CALLBACK=http://localhost:8080/auth/google/redirect + GITHUB_CLIENT_ID=< Get from Github Developer API > + GITHUB_CLIENT_SECRET=< Get from Github Developer API > + GITHUB_CALLBACK=http://localhost:8080/auth/github/redirect + AWS_ACCESS_KEY_ID=< Get from AWS > + AWS_SECRET_KEY=< Get from AWS > + S3_BUCKET_NAME=< s3 bucket name for uploaded pins> + NODE_ENV= + DEBUG=Pinterest-Clone:server + DEBUG_COLORS=1 + GOOGLE_APPLICATION_CREDENTIALS=< service account key path for cloud vision api > + OPENAI_API_KEY= + ``` + +5. **Run the development environment:** + + ```sh + npm run dev + ``` + + You can now go to `http://localhost:8080/` and see the project running in dev mode. + +### Using Docker + +If you have Docker installed and a `.env` file with the contents from above, then from the root directory: + +1. **Build and run the images:** + + ```sh + docker-compose up + ``` + +2. **Access the application:** + + Go to `http://localhost:8080/` + + *Note: `MONGOLAB_URI` is already incorporated in the local Docker setup and is not needed in your `.env` file if fully running with Docker.* + +## Testing & Build + +### Testing + +```sh npm test ``` -``` +```sh npm run coverage ``` -## Lint -``` + +### Lint + +```sh npm run lint ``` -## Compile TS -``` +### Compile TypeScript + +```sh npm run compileTS ``` -## Build -``` + +### Build + +```sh npm run build_server && npm run build_client ``` -## Run -``` + +### Run + +```sh npm start ``` + ## Built With * [Node.js](https://nodejs.org/) - JavaScript runtime * [React](https://reactjs.org/) - A JavaScript library for building user interfaces * [MongoDB](https://www.mongodb.com/) - Database * [Express](https://expressjs.com/) - Node.js web application framework -* [Material UI](https://mui.com/) - A library of React UI components that implements Google's Material Design. -* [Google Cloud Vision API](https://cloud.google.com/vision/docs) - image labeling, face and landmark detection... +* [Material UI](https://mui.com/) - A library of React UI components that implements Google's Material Design +* [Google Cloud Vision API](https://cloud.google.com/vision/docs) - Image labeling, face, and landmark detection +* [OpenAI](https://www.openai.com/) - AI-based image generation * [...and more](https://github.com/Dereje1/Pinterest-Clone/blob/master/package.json) ## Authors @@ -140,4 +164,4 @@ This project is licensed under the MIT License - see the [LICENSE.md](LICENSE.md ## Acknowledgments -* Hat tip to anyone who's code was used +* Hat tip to anyone whose code was used