Skip to content
Social network made in React for people who love popcorn. The single-page website enable users to add a profile, picture, see online friends, chat, make posts and manage friend requests.
JavaScript CSS Other
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
assets
public
sql
src
uploads
.babelrc
.eslintrc.json
.gitignore
.prettierrc.json
README.md
build.js
bundle-server.js
db.js
index.html
index.js
jest.js
package.json
password.js
s3.js
socket.js

README.md

about

POP for popcorn lovers was developed to be the first community dedicated to users who love popcorn. The POP users can feel safe in sharing all things related to our beloved popped corn. Users that do not love popcorn yet and want to learn are welcomed.

features

home, register or login and wall posts

Users are welcomed with an animation of popcorns popping. After registering or logging in they will navigate to the wall feature.

social network home gif

add profile picture and writing a wall post

Users can change their profile picture and post messages on their own or friends profile.

social network profile wall gif

add bio and change profile picture

Users can add or edit their bio and change the profile picture.

social network profile gif

friends

Users can see with whom they are friends with, navigate on their friend profile and accept friends requests.

social network friends gif

chat

Users can send messages to all the other users.

social network chat gif

search

Users can search for another user, see their profile and send friend request.

social network search gif

technologies

  • React
  • Redux
  • Express.js
  • AWS
  • Node.js
  • PostgreSQL
  • Socket.IO

instructions

you need an AWS account to run the POP for popcorn lovers.

  1. clone repository

    git clone https://github.com/ingriddorioschulze/popforpopcornlovers
    cd popforpopcornlovers
  2. install dependencies

    npm install
  3. setup database

    you need PostgreSQL at least version 9 and your system user needs to be able to access the server without a password.

    createdb socialnetwork
    cd sql
    psql -d socialnetwork -f users.sql
    psql -d socialnetwork -f friends.sql
    psql -d socialnetwork -f posts.sql
    
  4. create S3 bucket and credentials

    go to the AWS console and create a S3 bucket in the eu-west-1 region. in the bucket create a folder named as you want.

    the bucket and folder name need to be exchanged in the s3.js file with the one you created.

    in AWS IAM create security credentials for a user that can write to the new bucket and put the access key and secret into a file called secrets.json.

    {
        "AWS_KEY": "YOUR AWS KEY",
        "AWS_SECRET": "YOUR AWS SECRET"
    }
  5. start the application and the bundle server

    npm start

    in a new terminal

    node bundle-server.js

    now go to http://localhost:8080 in your browser

coming soon features

  • account deletion
  • private messages
  • friend request notifications
  • responsive design

credits

Images:

  • Google Images
  • Pinterest

Popcorn Animation:

@FrontierPsychiatrist

You can’t perform that action at this time.