Playbill DC - MEAN Stack Guide to Washington DC-Area Theaters and Shows
Overview and Purpose of Application
Playbill DC is a two-model MEAN Stack web application comprised of a hand-rolled API in which I scraped HTML data from this 2015-2016 DC Season at Glance Page using import.io and then converted the data into JSON. I also added theaters based on my knowledge of the local theater scene.
There are many theaters in this area, but as a theater-goer, it is hard to keep track of all the shows that are going on. Playbill DC acts as a central repository for almost 60 theaters and their upcoming shows. Users can filter this index of theaters and shows based on custom search parameters, and users can also add quick tags such as "kids" or "contemporary" so users can also search for theaters by those terms. Furthermore, there is an Up Next feature that only displays the theaters with shows happening in the current month.
Playbill DC is not only a quick way for users to check out their favorite theater, but is also a resource for discovering new theaters and their producitions.
This web application was built using the following technologies:
- import.io Screen Scraper to Parse HTML into JSON data
- RESTful API, renders data as JSON
- MongoDB (NoSQL Database)
- Mongoose Object Data Modeling (ODM)
- Back End Development
- Front End Development
- SASS Pre-Compiler, CSS, Bootstrap
- ArcGIS Web Map
- MongoLab (now MLab)
- Visit the application at Playbill DC.
- Make sure you have NPM and Node.js installed. If you don't, follow these instructions.
- After forking and cloning this repo, be sure to run the following commands in your terminal:
sass --watch /public/css/styles.scss:/public/css/styles.cssfor SASS aut-compiling.
- The UX for adding a new show is a little wonky: users create an empty object and then add in the data. I'd like to streamline this process.
- I added a nice white border around my show information, which still displays when the information is "hidden". Would like to still have the border when the information is displayed.
- I added a data attribute for months to filter for the "Up Next." I'd like to know if there is a better way to do this.
- Playbill Boston!
- Connect this with audition information for performers and application information for designers.