It is a small social network app that includes authentication, profiles and forum posts using the MERN stack.
A small social website for developers. This app allows developers to communicate, provide information and general share of knowledge. “Developer Alley”, is essentially a resource tool similar to other social apps such as "Twitter". The purpose of this app is that it will provide access to information, resources and allow developer to network.
- Login & Authentication using JSON Web Token
- Create User profiles and delete own profile/account
- Create posts, like posts, unlike posts and add comments
- Delete own posts and own comments
- View all developer profiles' basic information
- View full individual developer profiles
These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system.
| Client-side | Server-side |
|---|---|
| react: ^17.0.2 | axios: ^0.24.0 |
| react-dom: ^17.0.2 | bcryptjs: ^2.4.3 |
| react-router-dom: ^6.2.1 | colors: ^1.4.0 |
| react-scripts: ^5.0.0 | config: ^3.3.6 |
| redux: ^4.1.2 | dotenv: ^10.0.0 |
| redux-devtools-extension: ^2.13.9 | express: ^4.17.2 |
| redux-thunk: ^4.1.2 | express-validator: ^6.14.0 |
| uuid: ^8.3.2 | gravatar: ^1.8.2 |
| jsonwebtoken: ^8.5.1 | |
| mongoose: ^6.1.3 | |
| normalize-url: ^5.3.0. |
A step by step series of examples that tell you how to get a development env running.
Clone or download
git clone https://github.com/rgoshen/dev_alleyChange directory into project folder
cd dev_alleyAdd a default.json file in config folder with the following
{
"mongoURI": "<your_mongoDB_Atlas_uri_with_credentials>",
"jwtSecret": "secret",
"githubToken": "<yoursecrectaccesstoken>"
}Go here for instruction on getting your personal access token from Github
Install server dependencies(Linux & Windows PORT: 5000, Mac PORT: 5001)
npm installInstall client dependencies(PORT: 3000)
cd client
npm installNote: you need to run both server and client concurrently Run both Express and React from root
cd ..
npm run devcd client
npm run buildAfter running a build in the client 👆, cd into the root of the project.
Make sure you duplicate default.json and rename to production.json in the config folder.
And run...
Linux/Unix
NODE_ENV=production node server.jsWindows Cmd Prompt or Powershell
$env:NODE_ENV="production"
node server.js
For the live version go here.
If you followed the sensible advice above and included config/default.json and config/production.json in your .gitignore file, then pushing to Heroku will omit your config files from the push.
However, Heroku needs these files for a successful build.
So how to get them to Heroku without commiting them to GitHub?
What I suggest you do is create a local only branch, lets call it production.
git checkout -b productionWe can use this branch to deploy from, with our config files.
Add the config file...
git add -f config/production.jsonThis will track the file in git on this branch only. DON'T PUSH THE PRODUCTION BRANCH TO GITHUB
Commit...
git commit -m 'ready to deploy'Create your Heroku project
heroku createAnd push the local production branch to the remote heroku main branch.
git push heroku production:mainNow Heroku will have the config it needs to build the project.
Don't forget to make sure your production database is not whitelisted in MongoDB Atlas, otherwise the database connection will fail and your app will crash.
After deployment you can delete the production branch if you like.
git checkout main
git branch -D productionOr you can leave it to merge and push updates from another branch.
Make any changes you need on your main branch and merge those into your production branch.
git checkout production
git merge mainOnce merged you can push to heroku as above and your site will rebuild and be updated.
- rgoshen - Idea & Initial work - Email me: rick.goshen@gmail.com (welcome, say hi!)