Author: seatunacodes

Angular Custom Query Encoder

Posted on by seatunacodes

Every now and then I think about what I should post in this blog of mine. I keep meaning to post more about Angular since I use it almost everyday…

I’ve been working with Angular 2+ a lot for the past year, and it’s been some serious ups and downs.  Not just learning a new framework as a new developer, but the real pain has been upgrading between different versions! But that’s not what I’ll be talking about today.

I recently ran into the issue that Angular’s query encoder doesn’t encode all the characters that we need it to. For a while, we just used encodeURIComponent to encode our queries without using the Angular encoder or URLSearchParams. Today I’ve finally gotten around to extending the QueryEncoder and refactoring our code use URLSearchParams. It was actually really simple, and the code is much cleaner now! 😀


import { QueryEncoder } from '@angular/http';

export class CustomQueryEncoder extends QueryEncoder {

encodeValue(v: string): string {
return encodeURIComponent(v);
}
}

久しぶり It’s been a while!

Posted on by seatunacodes

久しぶり(ひさしぶり, hisashiburi) – “it’s been a while; a long time; long time no hear; long time no see; long time”

It’s been a while since I last posted on this blog (excuse the random Japanese, I feel like my non-programming language skills have gotten rusty!).  Since my last post, I got a job as a developer (mainly front end, with a side of UX work here and there).  I’ve been busy with work, and classes (my employer pays for them yay!) so I haven’t even thought about blogging until fairly recently.  Lately I feel like I’ve just been doing the daily rituals of work and getting things done.  It’s significantly less hectic than bootcamp (except when we approach the end of the sprint), and I sometimes feel like I’m not learning as much as I used to, and slowly losing some of the things I’ve learned but don’t use regularly.  I’ve thought about some ways to fix this, and one thing I’d love to do is volunteer to teach somewhere, whether it be kids or adults.  However, I don’t really feel I have the confidence to do so right now.  Which is why I’ve come back to this blog.  I’m hoping to become more articulate about my knowledge and skills, and writing about programming and webdev will help me really materialize the thoughts and knowledge in my brain that I often have trouble expressing in words.

Looking forward to posting more in the future!

HTTP Requests

Posted on by seatunacodes

HTTP stands for HyperText Transfer Protocol.

Browsers send requests to servers, which returns a response.  I’m drinking bubble tea right now, so I’ll use a bubble tea analogy:  I ordered a Red Wow Milk (GET request), and the barista returned a yummy cup of bubble tea to me (response).  In this case, I would be the browser and the barista would be the server (literally!), the bubble tea is what I requested.  I would also like to note that they gave me the wrong drink… (there must be a bug somewhere ahhhhh!)

Every time we type in a url into the address bar of a browser, it sends a GET request to the server.  The server then looks at the parameters of your request, finds what you’re looking for, then returns the site to your browser (assuming the request was a success).

Types of requests:  GET, PATCH, POST, PUT, DELETE, OPTIONS, HEAD

Server responses come in different flavors, my personal favorite is 200 OK because that means everything is working!  400 typically means there’s a missing file or route, 500 is annoying because it could mean many things.  Always read your errors and Google if you don’t understand it!!

Summary:  Browsers (or clients) sends a request to the server, and the server sends a response.  The response you get will not always be what you want, but it will often give you a hint about what went wrong.  If you get no response, then your request isn’t being made for some reason.

http://learn.onemonth.com/understanding-http-basics

Group Projects

Posted on by seatunacodes

It’s been a while since my last post.  WDI and life has just consumed so much of my time that I barely got enough sleep for the last couple of weeks.  I think it’s finally catching up to me, I’m pretty exhausted by the end of class.  I’ve even been going to bed earlier (getting 6-ish hours of sleep instead of 4-5!) the past week but I still feel tired D: ughhhh might be lack of CogniTea, they seem to have cut off our supply.

I reeeeealllyyyy should be doing my Ember.js reading assignment right now, but I wanted to write about my experience with the group project before I put it off again.

The Fridge – A Dropbox Clone, except we store everything in an Amazon Web Services account.

Initially, I was really nervous about the group project since most of my previous experience working in groups (mostly in school) usually resulted in me doing most of the work.  I was pleasantly surprised how well my teammates and I gelled together!!  Perhaps it was our generally chill attitudes, but I’m super glad that we worked so well.  We all had contributions in both the front and back end, and I’m quite happy with what we turned out.  It’s by no means perfect, but I had no idea how good our project would turn out!

A couple of things I’ve learned about working in groups:

  • Pair programming is super important.  Although it kind of felt slow having one person type and another person directing, in reality, solving problems with two heads is much faster and more efficient than with one.  I think we definitely were able to learn from each other as well.  I think CSS is one of my weak areas, but I learned some handy tricks from my teammate that I’m definitely going to use on my next project!!
  • Communication is key.  We did have a few merge conflicts during the project, but we definitely had fewer than others.  Part of that I attribute to how we would always tell our teammates when / what we were committing, what files / branches we’re working on, and so on.  We also made it a group activity every time we merged anything into our development branch, or when we had merge conflicts.  Good communication definitely helped decrease the number of conflicts and our stress /anxiety levels since we always knew what other people were working on.
  • I actually like working in a group / team setting more than I thought!! It’s so much more productive.  I feel like I spend less time being stressed out, and I also learn from my other teammates.  It’s nice being able to get another opinion on the code you’re working on, without struggling to explain your problem or code.

I definitely want to work in a positive and collaborative environment when I get that developer job in the future.  This project is definitely something I’m proud of!

What is SOLID?

Posted on by seatunacodes

SOLID is an acronym that stands for the five basic principles of object-oriented programming and design.  Following SOLID allows for programmers to create systems that can be easily managed and extended over time.

Single Responsibility Principle – Every module or class should only be responsible for one part of functionality.  There should only be one reason for a class or module to be changed.  The wiki talks about an example of how you should not need to change a class or module for more than one reason; if content and styling need to be changed, that should require changing 2 different modules / classes, and not just one.  One module or class should not have functionality that affects more than one thing (ex. content and styling).  Each module / class should be encapsulated to minimize breaking code when you change something.

Open/Closed Principle – “Open for extension, closed for modification.”  Open means it is possible to add fields to the data structures or new elements.  Closed means it can be used by other modules.  Inheritance is useful, because you can add subclasses that will inherit from the parent and add something different, without changing the parent class.

Liskov Substitution Principle – “If S is a subtype of T, then objects of type T may be replaced with objects of type S (i.e., objects of type S may substitute objects of type T) without altering any of the desirable properties of that program (correctness, task performed, etc.)”  Type is different from class.  Classes define how objects are implemented while type refers to its interface (the set of requests to which it can respond).  <— Taken from Stack Overflow!

Interface Segregation Principle – “many client-specific interfaces are better than one
general-purpose interface.”  Also called role interfaces, these smaller interfaces keep a system decoupled and make it easier to refactor, change, and redeploy.

Dependency Inversion Principle – Called inversion because it may be inverted to the way some people think about object oriented design.  According to wiki:

  • High-level modules should not depend on low-level modules. Both should depend on abstractions.
  • Abstractions should not depend on details. Details should depend on abstractions.

Rather than having low level modules dependent on high level ones, they should all be independent.  I think the general point of DIP is the decrease dependencies in your code.  I can see how dependencies can be bad for code since one change in a piece of code could affect another piece of code, which may not be what you wanted to do.

Hmmm… I can’t say I completely understand everything in SOLID yet, but this is definitely a start.  I’ll try to update this post when I have a better grasp of everything!

Some links!

Week 4 – Ruby

Posted on by seatunacodes

Today was day 1 of Ruby at bootcamp.  It’s definitely a nice break from the crazy that was project week.  So far, I haven’t felt like ripping my hair out yet so that’s good.  I’m looking forward to learning more about Ruby, it seems much more intuitive than JavaScript.  Though it feels really weird not ending everything with a semicolon!

Part of today’s assignment was to compare methods for JavaScript arrays and Ruby arrays.  I figured I should just post it here for my personal reference.  An easy blog post since I’m really just copy-and-pasting!

Method

  • .push()
    • Similarities:  Adds an element to the end of the array
    • Ruby:  Also returns array
    • JS: Only returns the length of the resulting array
    • Example: array = [‘Pokemon’, ‘Digimon’, ‘Monster Rancher’]
      • array.push(‘Yokai Watch’)
      • Ruby returns [‘Pokemon’, ‘Digimon’, ‘Monster Rancher’, ‘Yokai Watch’]
      • JS returns 4
  • <<
    • Similarities:  None, JS doesn’t use the so-called ‘shovel-operator’
    • Ruby: Essentially same as push in JS, but also super cool because << allows you to link other elements, so you can just shove in multiple elements at the end of an array
    • Example:  array = Array.new(3)
      • array is now [nil, nil, nil]
      • array << ‘Fenway’ << ‘TD Garden’ << ‘Museum of Science’
      • so now array looks like this:  [nil, nil, nil, ‘Fenway’, ‘TD Garden’, ‘Museum of Science’]
  • .pop()
    • Similarities:  Removes element from the end of the array and returns removed value
    • Differences: ? Google-sensei hasn’t told me anything yet… shall revisit at a later date
    • Example:
      • bigbang = [‘G-Dragon’, ‘TOP’, ‘Daesung’, ‘Taeyang’, ‘Seungri’]
      • Ruby: big_bang.pop() results in the bigbang array becoming [‘G-Dragon’, ‘TOP’, ‘Daesung’, ‘Taeyang’], but what actually prints is 4
      • JS: Same.  No offense to any Seungri fans, I like him too >_>
  • .unshift()
    • Similarities:  Adds element to the front of the array
    • Ruby:  Returns resulting array
    • JS:  Returns length of resulting array
    • Example:
      • bigbang_songs = [‘Fantastic Baby’, ‘Monster’, ‘Bang Bang Bang’]
      • Ruby:  bigbang_songs.unshift(‘Lies’) results in [‘Lies’, ‘Fantastic Baby’, ‘Monster’, ‘Bang Bang Bang’]
      • JS: Output is 4
  • .shift()
    • Similarities:  Removes element from the front of the array and returns the removed element
    • Differences: ? Same as .pop()
    • Example:
      • bigbang_jsongs = [‘Tell Me Goodbye’, ‘Stay’, ‘Gara Gara Go’]
      • bigbang_jsongs.shift() results in the array become [‘Stay’, ‘Gara Gara Go’] but the output is just 2.

I’ll update this post once I figure out the missing stuff.  I also should figure out how to type code block things in blog posts… do backticks work???

“`test“` <— and the answer is no

Goodnight everyone!

Week 3: First project!

Posted on by seatunacodes

I haven’t been updating very diligently 😦 The WDI has taken over my life, in addition to the other responsibilities I have, and keeping up with personal hygiene!

I wanted to write a bit of a reflection now that my first project has finished.  I’ll come back to writing about my first 2 weeks possibly later today (assuming that I find my MIA notebook…)

Week 3 was all about completing our first project, a tic tac toe game rendered in the browser.  We used javascript and jQuery for the game logic, and ajax for user authentication, as well as creating, saving, retrieving game data in the back end.  Since most of the ajax stuff was copy and pasting from our class notes, I thought figuring out the game logic would be the hardest part.  I was so. very. wrong!  I think I need to get a better understanding of ajax and APIs… CSS / SASS also proved to be quite the nuisance, the slightest typing error broke everything lol

Things I’ve learned:

  • Pair programming, talking to your peers, extra sets of eyes, and just having peers in general going through the same thing really helped pull me through.  There were a lot of ups and downs during the past week, and my peers and the instructors/consultants really helped me out
  • Not something new, but reaffirmed:  With the right search keywords, the internet has most of the answers to the questions you have!  Stack overflow and other sites have been a great resource
  • When using jQuery, using classes works more often than IDs do… there were so many times that I used IDs and it didn’t work, despite there being no other instances of that specific ID… as soon as I switched to using a class instead, it worked -_-
  • It is ok to write code you’re unsure of, especially if you’re stuck.  When I finally figured out all of the game logic, I had over 200 lines of code and half of it had been commented out because I knew it was useless.  But writing out that code helped me figure out what worked, and what didn’t work.  I just deleted all of that useless code once I was done.

This I should work on:

  • Figuring out when I need to walk away from my code for a break.  I spent a lot of time staring at my screen and not really getting anything done, but still stuck. :/
  • Study up on APIs and ajax
  • Asking for help more often and figuring out the right questions to ask.  Like I said, too many hours were spent trying to figure things out myself while I had no clue where I was even going wrong
  • Being more methodical about my process.  Being more organized and planning out my code before I actually write it would help too.  I’ve gotten away with being disorganized all my life and now it’s biting me in the butt >_>

Questions / Random final thoughts:

  • I might need to get rid of my double spacing after a period habit.  In HS I was taught that was proper typing, but I’m finding it cumbersome when I need to only do one space sometimes…
  • I played 57 episodes of Inu Yasha in the background while I coded at home… and it doesn’t cover all of the time I spent coding at GA.  I just made some final changes to my project and ran out of eps on Netflix, moving on to Death Note.  I can only concentrate on coding if whatever is in the background is something I’ve already seen XD
  • The bf is probably no longer surprised when I feel the need to burst out into song when a particularly nostalgic anime opening / ending is playing. “「深い森」by Do As Infinity brought me back to little 14 year old me XD
  • Holy sugar-honey-ice-tea, I programmed a thing on the internet!

I believe we’re starting Ruby next!  I don’t really know much about Ruby, but I’ve heard great things about it.  Can’t wait to see how it all turns out~

WDI Orientation / Installfest

Posted on by seatunacodes

Yesterday was orientation / installfest for the Web Development Immersive bootcamp at General Assembly.  I was pretty nervous and also super excited.  We spent the first half of the day doing typical orientation stuff which (of course) started off with an icebreaker.  We went through in detail the course schedule, expectations, graduation requirements, and so on.  The last part of orientation was installfest, where everyone had to install all the necessary software for the program.  I didn’t think it would take long but a lot of people (including myself) were having some technical problems.

Overall thoughts and first impressions:

  • I really like the type of learning environment that the instructors / mentors have set up for us.  It was only Day 0, and they make it very clear that they are there to help us succeed.  They were strict (called out someone for not paying attention), but I think this will ultimately benefit us.  Expectations for the course were laid out, and it included detailed considerations about the behavior of each member of the cohort (ex. do the assigned reading / homework or you’ll just drag everyone down) which I didn’t expect, but makes so much sense to do so prior to the course.  I’m pretty happy with my first impression of the instructors, I can already tell that it will be much different from grad school, and in an extremely positive way.
  • Everyone in my cohort that I’ve talked to are very nice.  It felt comforting to know that there were others who had a very similar background to me, and that we’re all in this together!  I’m excited to get to know these people more in the next 12 weeks! 🙂
  • They showed us a TED talk, The power of belief – Mindset and Success by Eduardo Briceno, that I found very inspirational. He talks about fixed mindsets vs. growth mindsets when it comes to learning, driving the point that being more open to learning and believing in your own ability to learn is extremely important. My favorite part is how he tells everyone not to say “I can’t do this,” that you should say “I can’t do this… yet.”

We're all in this together!

I’m feeling very optimistic about WDI right now, though I know that it’s going to be crazy.  Half nervous, half excited.  Let’s see how I feel again in another week XD

Let the Blogging Begin!

Posted on by seatunacodes

Hello!

This is the first post to my serious (a.k.a. not the insanity that is tumblr) blog.  It’s been a long time since I’ve blogged seriously, and now is really the best time to do so!

So why have I created this blog suddenly?  Because I’ve made a seemingly-crazy life changing decision, and I’ve decided to keep a blog dedicated to this new adventure!  With the encouragement of my family and loving boyfriend, I applied to a coding bootcamp called General Assembly.  And I got in!  I quit my uneventful medical laboratory job, and will be starting the Web Development Immersive program on the 19th!

Before applying, I scoured the internet for opinions about coding bootcamps, especially General Assembly.  There were a lot of mixed reviews, and I felt like there really wasn’t as much information as I would’ve liked.  However, I did stumble upon a few blogs run by graduates of the WDI dedicated to their General Assembly experience.  Unfortunately, none of them were in the Boston area, but these blogs helped me get an idea of what the course will be like.  Another thing that bothered me was that I only found 2 blogs run by women who went through the course.  I always hear about how there aren’t enough women in tech, so I was curious to read more about their experiences.  So I’m hoping this blog will be useful to other women who are interested in learning to code!

I’ve also read that potential employers like to look at applicants’ blogs… whether or not that’s true, it really doesn’t hurt to start a blog, so I might as well!

The only downside I see from this right now is that I can’t actually code my own website using WordPress without paying (at least to my understanding…).  This theme is really nice, but I would have preferred to start completely from scratch without having to pay $ to host the actual site… oh well :/

I do like how the fish in my header looks!  It’s a picture I took of a statue when I visited Colombia for a school project a few years ago.  That was actually before I got the nickname of ‘seatuna’, didn’t think this photo would come in handy!