Skip to content

Project three of four - A single-page, fully RESTful, MEAN stack app, created in a group. Festinate is a mobile-first festival companion app featuring user authentication, a friending system, a number of external APIs, and more.

License

Notifications You must be signed in to change notification settings

curtisburns/festival-companion-app

 
 

Repository files navigation

General Assembly WDI Project 3: Festinate (Group Project)

Welcome/Login

Visit the Easel app on Heroku

View the Easel app on GitHub

Brief

Your instructors will partner you with other classmates to design and collaboratively build a MEAN stack app of your own design.

Your app must:

  • Use Mongo, Node & Express to build a server-side API
  • Your API must have at least 2 related models, one of which should be a user
  • Your API should include all RESTFUL actions for at least one of those models
  • Include authentication to restrict access to appropriate users
  • Include at least one referenced or embedded sub-document, however don't go crazy! You need to manage your time effectively...
  • Include automated tests for at least one resource
  • Use Angular to build a front-end that consumes your API
  • Use SCSS instead of CSS
  • Use Webpack & Yarn to manage your dependencies and compile your source code

App Description

Festinate is a festival companion app, designed for mobile first. The purpose of the app is for festival organisers to be able to add an event to the feed so that users can confirm their attendance and arrange car shares, while also being informed of the weather for upcoming events. This is achieved through the use of a passenger and attendee system and external APIs such as MapQuest and Dark Sky.

Technologies Used

  • HTML5
  • SCSS
  • JavaScript(ECMAScript 6)
  • Node.js
  • angular: v1.7.3
  • @uirouter/angularjs: v1.0.20
  • bulma: v0.7.1
  • moment: v2.22.2
  • satellizer: v0.15.5
  • MongoDB
  • bcrypt: v3.0.0
  • bluebird: v3.5.1
  • body-parser: v1.18.3
  • express: v4.16.3
  • jsonwebtoken: v8.3.0
  • mongoose: v5.2.8
  • morgan: v1.9.0
  • request-promise: v4.2.2
  • chai: v4.1.2
  • mocha: v5.2.0
  • nyc: v12.0.2
  • supertest: v3.1.0
  • Git
  • GitHub
  • Heroku
  • Trello
  • Sketch
  • Marvel
  • Google Fonts
  • Fontawesome

APIs Used

  • Dark Sky
  • Filestack
  • Mapquest
  • Nominatim

Approach Taken

Wireframes

We began wireframing on Sketch, using a Sketch template as a guide. We then moved to Marvel to link the pages up.

Login

Login

Festivals Index

Festivals Index Wireframe

Festivals Show

Festivals Show Wireframe

Car Shares Index

Car Shares Index Wireframe

Profile Page

Profile Page Wireframe

Functionality

We started out by building and testing the back end, before building the front end and styling. Everyone in the group worked on a part of each section.

We started out by getting the basic RESTful routes working (users, festivals, and car shares) before moving onto extras such as friend and passenger requests which took longer.

Ellie then took care of adding the APIs such as Dark Sky and I added Filestack. Unfortanatly due to time constraints, and the dependency on some of the features relying on the passenger and friend system, we were unable to complete some of the functionality, which is mentioned below as future features.

Styling

Since most people would use this app on mobile, perhaps even whilst at a festival, we designed for mobile first. So we used Bulma to take advantage of its cross-device capabilities. At the time of delivery, Festinate was optimised for iPhone 8 (and other phones of similar screen sizes,) and was not styled so well for larger or smaller screens. However, this is something to change in the future.

Finished Product

Welcome/Login

Welcome/Login

Festival Index

Festivals Index

Festival Show

Festival Show

Festival Show

Car Share Index

Car Shares Index

User Index

User Index

Profile Page

Profile Page

Blockers

A significant blocker for me was the testing, which after having just been introduced to it, I was unsure if the reasons they weren't passing was due to the fact that my code had bugs or if I had written the tests correctly. This took up much more time than I had expected, which push other plans back. If I was to have gone through the experience again I would have taken a break from trying to get the tests working much sooner to get more of the main functionality into the app.

Wins

A big win for me would be to have implemented the passenger, attendee and friend request functionality, as it proved extremely challenging to do. I feel that while I managed to achieve it, if I had started working on it sooner, we would have had more time to add and refine the other features that I felt were quite important to the purpose of the app. Also, some features could not have been added until these were completed so we could not skip these out.

Another win would be the quality of the wireframing/designing. I feel it gave us an idea of what it was that needed to be done by giving an idea of the structure of the app. It was also great to have been able to achieve a final product that resembled what we originally designed.

Future Features

The app was intended to be a companion app for festival goers, and we felt that a really good feature for this would have been for users to be able to track their friends at festivals using a geolocation that the user last checked in. It would also be good for users to be able to place a marker where their tents are and for festival organisers to create a map with markers for main stages, toilets, food stalls etc for users to navigate. The map and carshare planner could also be taken further, with costs being calculated based on the car and distance and the number of pickups along the way.

About

Project three of four - A single-page, fully RESTful, MEAN stack app, created in a group. Festinate is a mobile-first festival companion app featuring user authentication, a friending system, a number of external APIs, and more.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 71.1%
  • HTML 21.8%
  • CSS 7.1%