WDI Day Forty-Eight: Web Sockets and Lab Time

Web sockets are a way that users can interact in real time with each other on websites. During class we did a quick tutorial where we created a chatroom – it was some pretty cool stuff. After walking through the chatroom with socket.io, we tried to add Angular to the mix, and yet again it tripped me up a bit.

In the afternoon the instructors announced the web socket lab, where we will have to build a game with the MEAN stack and use web sockets. I can’t believe how many labs we’ve had – here I thought this weekend I would be able to get a head start on my final project. Looks like I’ll be refactoring the lab that was due this morning and have to complete yet another project.

I still feel pretty shaky with Angular JS, so I’m going to attempt to do several tutorials over the weekend. I did manage to put a basic MEAN stack framework in place for my lab project that I’ll work on customizing more tomorrow. I am also going to attempt to create Tic Tac Toe.

WDI Day Forty-Seven: MEAN Lab

The MEAN stack is pretty difficult to work with – at least it is for someone who is completely new to it. I enjoy working with Mongo DB, Node.js, and Express.js. The problem child in the stack is Angular – I’m realizing I’m not grasping everything that I thought I was.

Today was the last day to work on our MEAN stack lab. I decided to create an app where users can post their projects and have other users critique their projects. Users can upvote/downvote projects as well as critiques.

I was able to successfully complete the following:

  • Have users create new projects, delete existing projects, and view all projects
  • Have users upvote/downvote projects
  • Have users add critiques for different projects
  • Have users view all critiques made on projects
  • Have users upvote/downvote critiques
  • Seed the database with dummy data
  • Use show/hide Angular directives to make a better user experience

At this time, I have yet to do the following:

  • Allow users to update posts
  • Add the ability to delete comments
  • Create RegEx to prevent users from submitting critiques if the critique uses banned words or phrases
  • Polished styling (I was only able to do some preliminary styling)
  • Launch the app to Heroku

Although building this application was a huge struggle, I felt as though the application functioned a lot better than my project 3. It was also quite a learning experience!

Project Details:

MEAN stack application where users can upload projects and have other users upvote/downvote their projects. Users can also comment and upvote/downvote comments.

View the project

Technology Used:

  • MongoDB
  • Express JS
  • Angular JS
  • Node JS
  • Heroku

WDI Day Forty-Six: Building a MEAN App & Starting a MEAN Lab

We had an introduction to adding Angular to the mix when building apps with Mongo DB, Express JS, and Node JS. However, the intro was a little too brief for everyone’s liking. Essentially we walked through an exercise that incorporated Angular with the rest of the stack, but not many of us were feeling at all confident with this new component.

After attempting to complete the in-class assignment, we were introduced to our lab for the week – building a MEAN stack application. We could either work in groups or alone. Although I enjoy working with others, when I’m struggling to retain new information, I do much better being able to struggle and absorb things on my own a little bit before returning to the group. Thus I opted for working on my own project.

It was a bit of a struggle – I tried to walk through the in-class assignment several times, but was unable to build something that could function. Next I started Googling all sorts of tutorials, desperate to find a working example of a way to format and use all these different pieces together. Luckily, I finally stumbled upon something that worked and helped me add basic CRUD functionality to the app. Once I had the working pieces in place, I pretty much called it a day. I was pretty sleep deprived from the day before, but I did indeed successfully complete a large chunk for the lab.

I’m hoping that tomorrow goes well and that I can successfully refine this application. I have a sturdy foundation now–all I want to do now is add to it and read over a few documents to make sure I’m understanding everything involved with the basics for the MEAN stack.

WDI Day Forty-Five: Mongoose with Express & Intro to the MEAN Stack

After feeling really frustrated with Angular JS, I spent the weekend reviewing a few exercises and found myself beginning to feel a little bit better about Angular. I think the problem was that I was so overwhelmed with my group project, trying to tackle the front-end and back-end on my own, that it was all too easy to get discouraged by every technology we were using.

Today we did more work with Express and Mongoose, and worked on a lab where we created a very basic CRUD app in Express. I’m liking Express better than Angular thus far, but I really do need to immerse myself with both more to really know for sure how I feel. We also received a bit of an overview of the MEAN stack, but only really focused on using Mongo, Express, and Node. I’m looking forward to seeing how we incorporate Angular with this stack.

WDI Day Forty-Four: Express & Mongo Intro

It’s been an exhausting week, but thankfully projects are over and today we had an introduction to Mongo and Express. We reviewed Mongo DB, which is a no SQL database, and used Mongoose to make queries. When it comes to databases, I’m realizing that I really enjoy working with querying for information. For some reason there’s something fun about that.

Express proved to be a little bit confusing. It made me realize that this weekend I need to review Angular JS and also do a little document diving with Express. I want to make sure things make a lot more sense to me in the upcoming weeks.

Resources