Hereinpittsburgh.

Photo by Todd Medema on Unsplash

Motivation:

In Pittsburgh, even across the country, group chats in WeChat is the first choice for local Chinese, especially Chinese students to do second-hand trading, sublease apartments, and post events. I personally have more than 10 groups to do so. Since WeChat Group is not designed to be the Chinese version of Craigslist, the bad user experience sometimes drive us crazy. For example, invitation is explicitly required for users to post and get access to the information in a group (normally with a limitation of 500 users). Also, the posts in group chats tend to be messy and tedious.  To solve the listed and other existing problems, I came up with the idea of HereInPittsburgh.

HereInPittsburgh is an independently developed website. It's a Craigslist for Chinese community in Pittsburgh. Hopefully it can smooth people's life in Pittsburgh, helping users get rid of the tedious and inefficient WeChat groups.

Demo

Demo 2:  View a post

Demo 3:  Add a new post

Demo 4:  Sign up

Demo 1:  A peek at HereInPittsburgh

Technical approach

Back-end Language

Database

Front-end Language

Libraries

Server

developed on

IDE

version control on

deploying on

domain service from

Main features

Security Issues:

  • HereInPittsburgh uses environment variables to keep the keys out of the code. It saves sensitive data, s3 access key for instance, as config vars in Heroku.

  • This website protects users' usernames and passwords by Passport.js.

Authentication:

  • Sign Up (check input format and duplicate username).

  • Login / Log Out.

  • Posts or comments can only be created after logged in.

  • Go back to previous page after logging in. (express-session)

Upload , Resize & Store Images:

  • Original Solution: Transloadit.

  • Current Solution:

        Images uploading: multer

        Resizing images to 1000px*height or width*1000px: imagemagick

        Images store:  Amozon-S3

Google Maps: See demo 2 and 3.

  • Auto-complete search.

  • Showing a circle instead of marker on personal address to protect users' privacy.

Search:  Search keywords for posts.

 

Profile: Users have their profile page, showing posts they created and favorited.

 

Posts' Sorting:  Posts are sorted chronologically. Editing or making comments will bring the post on top.

 

Flash Reminder:  connect-flash

 

Add a post / Show a post:  See demo 2 and 3.

 

Add comments:  See demo 2.

 

Edit / Remove a post

 

Accessories:   ejs  body-parser  method-override  passport-local  bower

                            lightbox  semantic-ui-calendar

Potentials

Limitations and Feasible Improvements:

In Progress:

  • Explore Pittsburgh: 

        A Yelp-like guide for people new to Pittsburgh, with popular spots (food, shopping, entertainment, etc.) marked on a map. Registered users can add new spots or comment on existing ones.

  • WeChat Interoperability:

        To migrate users from WeChat groups to HereInPittsburgh with a smooth transition, designed a web interface to generate a picture from posting page, which can be shared to WeChat groups later.​