WDI Day Forty-Two: Project Week 3, Part 4

Today was the last full-day of the group project. I’m disappointed that my group’s application has minimal functionality, although I’m pretty proud that we learned quite a bit about how to work with the following technologies:

  • Angular JS (although I’d really like to work through a few more tutorials)
  • Mounting Angular on Rails
  • Angular Material
  • Bower
  • Creating APIs in Rails
  • Deploying to Heroku while working through minification errors

WDI Day Forty-One: Project Week 3, Part 3

The struggle is real. Working a group has made me aware of several things in the web development process. First off, planning and communication are key.

My group has run into quite a few roadblocks. We haven’t been able to successfully transform the app into the type of project we want it to be. I suppose, looking back at this project, I will look at it as a learning experience. I’ve learned quite a lot, but haven’t successfully rolled out as many features as I’d like to.

Tomorrow is our last full day to work on the project. I’m hoping we can fine-tune our MVP, and find ways to dress up the app. We shall see how it goes! I’m realizing it’s important to stay optimistic, even when things aren’t turning out the way you’d expect.

WDI Day Forty: Project Week 3, Part 2

Today proved to be a day of frustration for my group – we’re struggling with Angular quite a bit. I managed to build up the back-end coupled with Angular as the front-end, however I’ve run into issues getting CRUD to function for the API. Update and show are working, it’s just a matter of getting delete and new to work.

After a day of struggling with my code, I’m on the verge of scraping everything and rebuilding. Sometimes you need to cut your losses.

WDI Day Thirty-Nine: Project 3 Kickoff

The morning started off with reviewing the Git workflow process for teams. Up until now, we’ve never had to worry about merging branches. But with our teams for our project 3 work, we’ll definitely need to understand how to take care of this. It was difficult to concentrate during the Git review since everyone wanted to know who was in their group already.

When the project was announced, I was relieved. I’m grouped with two guys who are smart and have easy-going personalities. When it came down to it, I had the mentality that even though it would have been difficult if I was grouped with people who were difficult to work with, I could easily power through the process. Since after all, you do find yourself working with other people who you don’t necessarily get along with at work, so it’s something that you do run into from time to time in life.

The rest of the day was spent doing preliminary planning and mapping out how the project will go. We decided to work on a collaborative travel app, and we have yet to figure out how we’ll put the database together for it. I’m hoping I can resolve that over the weekend.

WDI Day Thirty-Eight: Angular Review & Lab Day

Apparently the vast majority of my class is struggling with Angular, so it’s good to know that I’m not alone. It’s been a lot of hours this week spent staring at code, attempting to make things, fiddling around with existing projects, and trying so desperately to get things to click.

This morning started off with a review, and then we had the rest of the day to work on a lab. We had to build an Angular app with a basic CRUD functionality. The app was called “WDI Radio,” and if we were able to get to it, we had to figure out how to play mp3 files in the app. I almost made it that far, but was proud of myself for putting together the app fairly quickly and deploying it with Firebase – something I had never done before.

wdi-radio-screenshot

WDI Day Thirty-Seven: Angular, APIs, & Firebase

I’ve reached the conclusion that Angular is hard. It will take some getting used to with running through several exercises before I feel comfortable enough with it.

Today we worked with Angular alongside Rails. It was cool seeing how we can create our own APIs when we need to be able to work with updating the API data. It was weird seeing how Rails as the back-end fits together with Angular as the front-end. We walked through putting together a couple of single-paged applications with the Rails/Angular combo, and I noticed that the Angular server acts a little wonky at times when working on updates.

In the afternoon we walked through working on a SPA with Firebase. Firebase is a Platform as a Service (PaaS), that offers a number of cloud-based computing services, including a realtime database. Firebase uses Websockets to maintain a constant, open connection between the client and the database. We used AngularFire, which is a way to connect an Angular application to a Firebase DB.

Resources

WDI Day Thirty-Six: Studio Visit & Angular

I had a chance to sit-in on a Scrum meeting at National Geographic, which was a pretty insightful experience. As someone who is coming from a background in working for nonprofits, it was great to get to see the planning phase that other companies go through.

Afterwards, we worked with Angular once more, although this time we combined our knowledge of Angular with API calls, putting together our first Angular CRUD application. It’s going to take a little while to get used to the format for Angular applications, with controllers and views, but I’m determined to ‘get it.’

Resources

WDI Day Thirty-Five: API’s and AJAX

Earlier this year I took a class in JavaScript development, so API’s and AJAX are somewhat familiar to me. Today I realized that I have a much better handle on these topics when it comes to tackling new projects, however, I’m looking forward to practicing my work with API’s so that I can feel more confident with that type of code.

Application Program Interface (API) is a service that provides raw data for the public. We reviewed how we can create our own APIs so that we can use them for CRUD functionality in apps, which was a pretty fun scenario to take a look at.

Asynchronous Javascript and XML (AJAX) do server side requests asynchronously on the client without having to send an actual browser request that reloads the page.

In class, we played around with the following code to make API requests – and I thought it was a pretty good chunk of code that I could use for future reference when it comes to API-related projects:

$(document).ready(function(){
$("h1").on("click", function(){
var url = "https://api.wunderground.com/api/api_key/geolookup/conditions/q/va/midlothian.json"
$.ajax({
url: url,
type: "get",
dataType: "json"
// $.ajax takes an object as an argument with at least three key-value pairs...
// (1) The URL endpoint for the JSON object.
// (2) Type of HTTP request.
// (3) Datatype. Usually JSON.
}).done(function(){
console.log("Ajax request success!")
}).fail(function(){
console.log("Ajax request fails!")
}).always(function(){
console.log("This always happens regardless of successful ajax request or not.")
})
})
})

WDI Day Thirty-Four: Intro to Angular

We started getting familiar with the structure for Angular applications, and how Angular is a framework where everything is very modular. Learning the different pieces and how they fit together was a little bit of a struggle. After being immersed in Ruby on Rails for a couple of weeks, it’s going to take a little while for my brain to readjust to JavaScript.

I learned about how directives are markers on a DOM element that tell Angular JS’s HTML compiler to attach a specified behavior to that DOM element. Angular expressions remind me a lot of inline Ruby code, which allow you to execute JS code in HTML files.

We got a head start on our homework, where I found myself running into errors. Hopefully when I work on it some more this weekend, all will get better.

WDI Day Thirty-Three: Project Week 2, Presentations

After an exhausting week of trying to get things to work, have things break, and also find myself unable to complete a few ‘nice-to-haves,’ I somehow made it through it all with a functional app that looks nice.

Today we worked on finishing touches for our applications. We also did screencasts of our apps to demo them. It was my first time ever making a screencast, and I’ll definitely need to do more of these in the future. Anyway, here’s mine:

I was really excited that this morning I managed to resolve my whole sending an image to the database issue. It was funny how I was almost in disbelief when I got it to work. Apparently I stared at my screen for a while and said, in disbelief, “I got it.” Everyone who was coding in the room cheered and high-fived me. They can definitely relate to how amazing it feels when you resolve an issue that seems impossible.

Later this week I hope to tackle some of my other unsolved problems. But for now, I’ll take a break and rest from this whole coding thing – I want my mind to definitely stay sharp.

mapsketch-screenshot