Skip to content

nghiadangtrong/create-social-network

 
 

Repository files navigation

Create Social Network npm PRs Welcome

Create Social Network is a tool for building Social Network applications using React, Node, GraphQL and MongoDB. You can set up local Social Network by running one command.

npx create-social-network my-network
cd my-network
npm start

(npx comes with npm 5.2+ and higher, see instructions for older npm versions)

After installation open http://localhost:3000/ to see your app.

npm start

Screenshots of some pages

Home Profile Explore

Demo

https://worldexplorer.netlify.com/

Features

  • News Feed Fresh posts from people you are following.
  • Explore New Posts and People.
  • Follow a particular user and get notified for their activity.
  • Personalize Profile With profile/cover photo and personal posts.
  • Notifications Get notified when someone follows you or likes/comments on your post.
  • Authentication & authorization with Password reset functionality.

Requirements and Configuration

App by default uses MongoDB hosted on mLab and Cloudinary CDN for hosting images. We have created demo user for mLab and Cloudinary so you can run app locally without adding Mongo URL and Cloudinary API Key, however when you start developing your application it is recommended to replace those information with your ones, so everybody has its own Database and CDN.

Replacing Mongo URL

Replace MONGO_URL value in api/.env file with your mLab database url or with local one.

Replacing Cloudinary API Key

Grab Cloud name API Key and API Secret from Cloudinary dashboard and replace corresponding values inside api/.env file.

Mail Provider

For password reset functionality you will need to replace Email Provider values also in api/.env file.

Creating an App

You’ll need to have Node 8.16.0 or Node 10.16.0 or later version on your local development machine

To create a new app, you may choose one of the following methods:

npx

npx create-social-network my-network

(npx comes with npm 5.2+ and higher, see instructions for older npm versions)

npm

npm init social-network my-network

npm init <initializer> is available in npm 6+

Yarn

yarn create social-network my-network

yarn create is available in Yarn 0.25+

It will create a directory called my-network inside the current folder. Inside that directory, it will generate the initial project structure and install dependencies.

my-network
├── api
├── frontend
├── node_modules
├── .gitignore
├── netlify.toml
├── package.json
├── README.md

The app is organized as Monorepo using Yarn Workspaces

Once the installation is done, you can open your project folder:

cd my-network

And start the application with npm start or yarn start that will run the app in development mode. Open http://localhost:3000/ to view it in the browser.

The page will automatically reload if you make changes to the code.

Deployment

In development mode we are starting api and frontend servers with one command, but we need to deploy them separately.

API Deployment

Frontend Deployment

Contributing

We'd love to have your helping hand on create-social-network! See CONTRIBUTING.md for more information on what we're looking for and how to get started.

Credits

Many ideas for CLI tool and Readme file are taken from Create React App project.

License

MIT License Copyright (c) 2019 udilia

About

Create Social Network by running one command. Demo: https://worldexplorer.netlify.com/

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 99.8%
  • HTML 0.2%