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

Technical approach

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

​

​

• Accessories: url-exists, del

​

multer

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:

​

• Improve the user authentication. Hopefully add Facebook and WeChat login. 

• Optimize the sustainable development progress. React would be a good choice to reconstruct or improve this project.

• Improve user experience. Add multi-languages to this site.