PickIt

Front-end when no one is logged on
Gallery with saved images
Login screen for Chrome extension
Saved image with tag
Context-menu with ability to save image

Inspiration

We wanted to learn more about Node.js and lots of other interesting technologies and combine them into a usable product.

What it does

PickIT is a system that lets you save and tag images that you see on the Internet into a small archive of your very own. The Chrome extension makes it possible to save these pictures as a context menu action, the web app allows you to view and tag them, and the API is the interface that lets them communicate.

How I built it

We used Node.js and Express to write the back-end API of the server, which handled GET and POST requests. The POST requests posting images to a user's account used the Amazon S3 API. The front-end was built with Bootstrap and the Pug.js engine to handle data from the server and present it in a nice manner. Finally, the Chrome extension was built with regular JavaScript.

Challenges we ran into

Building any project in a small time span is tough. A big challenge we faced during our development was splitting up the parts of the project so that everyone had something to do. The sections included building the Chrome extension, developing the API, and creating a front-end.

Coordination between teams is difficult, and this was our first time trying to write working code while ensuring that all the parts would work together. We used a combination of Google Docs and Github's issue tracking for communication.

Most of the technologies we used were new to us, and we had to read through lots of documentation to see how they worked. Lots of these technologies also involved difficult new concepts, such as image parsing and asynchronous function calls.

Also, apparently certain Chrome-extension JavaScript files don't log to the console. We learned how to debug with alerts instead.

Accomplishments that I'm proud of

We're happy that the whole system works well, since it took a lot of tinkering to get to that stage. In addition, we're also happy about how we got the chance to learn about new technologies and implement them in an interesting product.