Originally written on NOV 29, 2015 via Codepen here.

As I close up my bootcamp experience, I finished the week with a 2 week sprint within an scrum team and it was a very rewarding experience. I was put into a team with two other back-end developers who had started on a project for a client from scratch. The client had envisioned a sort of Yelp and TripAdvisor influenced site where his students can leave reviews of places they visit while studying abroad. The back-end being used was ASP.NET with Razor using C# programming language. The front-end was not built out yet, so I came in with another student to start on it from scratch!

The first thing we did was to gain a high-level understanding of the design requests of the client. So, we continually asked questions before moving forward to be on the same page with what the client wanted. After a colleague from Code for America introduced me to Balsamiq, I was impressed how easily it stored wireframe projects using myBalsamiq. In the past, I’ve tried out Omnigraffle and Axure RP Pro which are highly robust software prototyping apps. I just never really gave Balsamiq a chance since it seemed “Comic Sansy”. Let’s just say, lesson learned: don’t judge an app by its cover! 🙂

Balsamiq Desktop App Display

Back to my sprint story… The wireframes for the project can be viewed via myBalsamiq here (click on Study Abroad project). After doing those, I spent some time as well getting familiar within the Visual Studio environment connected to Team Foundation Server. This is a centralized version control system different from Git which is distributed and remote. I’m happy I was able to pick it up quickly, but there were some cases it was causing me headaches! The two major errors we came across and fixed were 1) having to install SQL Server 2014 Express in order to connect to the database upon rendering builds and 2) making sure I stay on the current project version and merge it with what I am working on. Basically, in Github, this would be done when creating a feature branch and making a Pull Request, as any upstream changes would be added automatically. It’s different using TFS as the version control system in this way.

The second week was comprised of deciding on using Bootstrap as the front-end framework for this application. Going in, I was thinking of using Angular 1, however, it didn’t make to sense based on what the client was looking for which contained very few Single Page Application uses and interfaces. Me and the other developer also had more experience using Bootstrap and seeing that we were in a time crunch, it left us with little time to experiment with connecting Angular to the app. I am definatley looking for a reason to use Angular these days, so building an app with it is next on my list!

Within a few days, I designed the hero header connected to the homepage and connected it to the Mapbox.js API. If you haven’t heard of Mapbox, it’s an open source map platform that offers several design and API options to customize maps placed on the web. The creators of Leaflet.js are linked to Mapbox. In this process, I also tried out the iframe embedded code, but it had limited dynamic functionality that the actual API offered that we would need. The search function in the map was important to include and allowed for geocoding (the dropdown menu of relevant searches you see when typing a location).

Geocoding with autocomplete feature

Overall, we made a lot of headway in the two week time frame and learned so much each day. We had daily standups to attend to report in our progress and keep us accountable. You can view the code I contributed to the project on my Github here. It was great working in a team environment and implementing Agile methodologies, along with becoming familiar with the ASP.NET MVC architecture. We are passing it off to new students coming in and can’t wait to see where it will be several months down the road!

Sign up today for free and be the first to get notified on new front-end dev tutorials, hacks n' more.
We hate spam just like you. Your email address will not be sold or shared with anyone.