week 2 recap

whaddya learn
  • | jQuery
  • | MySQL

This week’s goals were to tackle jQuery in around three days and learn enough MySQL to conquer thirty or so brain teasing database queries. In the previous bootcamp I found jQuery really interesting, but it wasn’t until this second time around that I realized one of the amazing benefits this library provides. jQuery provides some amazing methods and tools for accessing practically any element on the page, and in a familiar CSSey (is that a real word??? >.>) way. This is of course on top of all the animation and effect based functions.

I spent a ton of time helping the other students throughout the week and while explaining concepts I saw the beauty of mixing jQuery and javascript in the same statements. It is so fluid that at times I wasn’t having to thik about whether what I was doing was jQuery or not. Also, due to all the discussing I have done, the topics have assimilated and matured so much more.

cat_ninja cat_ninja2Once again I put my work up on github. I really enjoyed this particular jQuery assignment because it was the beginning of a game, and I love my video games.

some other things I worked on…
  • | PHP

checkerboard checkerboard2 checkerboard3
Beyond jQuery and MySQL, I started to work on PHP. One of my more memorable projects was a checkboard created dynamically with PHP, but I decided to add some jQuery to it and allowed the user to change the boards colors with either sliders or text inputs or even randomly.

Up until now, I haven’t had the assignment that hooks you and steals many hours of your time with fun tweaks and upgrades, but this was my first addiction. I iterated on this checkerboard many times, refining everything. I put the code here as usual, but I will also probably put it on my site as well (whenever I decide to finally make it… *sigh).

fin
Advertisements

week 1 recap

Whaddya Learn
  • | HTML
  • | CSS
  • | Git – basics

This cohort has started off very similar to the Mountain View one, but has some key differences. Our morning & evening lectures are given by the founder Michael and he has ambitious goals for us. Same as the CA bootcamp, We are expected to fully cover and feel comfortable with HTML & CSS by the end of week one. Once we have the tags & attributes, we demonstrate our understanding by recreating four different websites with HTML & CSS from screenshots… no inspect element. I’ll put up my work on GitHub.

One key difference between the two cohorts was day two. Day two’s lecture was on some of the basics of Git. While just add, commit, clone, push & pull were discussed, it has introduced everyone to not only the technology & theory of version control, but also shown them the initially scary terminal. In Mountain View we didn’t discuss Git until end of week two.

A second small difference is the frequency of rapid group projects. In week one we did three different group HTML & CSS website recreations from screenshots.

Here’s what I made

website4 - HTML & CSSwebsite4 - HTML & CSSwebsite4 - HTML & CSS

Some interesting tidbits…
  • | custom bullet indents
  • | linear gradients
  • | position absolute/relative

While helping the others, I found that when a custom bullet is specified in CSS using the :before selector, items wrapped in that li element will not indent to same margin as above. Achieving the correct indent can be performed through text-indent:-1em.

Since this first week was a review for me, I decided I would just recreate the fourth screenshot. Of the four assignments, it has the largest room for reusable elements, in my opinion. While creating this site, I looked further into linear gradients in CSS. Unlike my previous attempts, I found that custom color stops can be specified in the CSS. background: linear-gradient(to bottom, silver, white 50%) In this way, backgrounds can be two toned w/o a ramped transistion.

Also on the fourth site, one of the interesting points was aligning images to the bottom of div rather than just adding some margin above the image. This can be accomplished with position:relative on the containing div and postion:absolute;bottom:0; on the div to be aligned to the bottom. This probably isn’t the best, but it is certainly concise and pretty clean.

And that’s a wrap