Ellatronic
Design Portfolio

Blog

Posts in Education
Hackbright Front-End Web Development | Week 9 and 10

Week 9: Monday

  • Debugging
    • HTML & CSS
      • Common bugs include incorrect nesting, forgotten or misspelled tags, incorrect use of float, clear, and positioning, CSS rules overriding in unexpected ways.
      • Use the developer tools to inspect your code and remove elements until the problem is found or it starts working. Adding borders and background to see sizes and nesting can help.
    • JavaScript
      • Common sources of bugs include when callbacks are not hooked up to the correct events or variables are not being set correctly.
      • Break up changes into small pieces and always make sure the code is runnable.
      • Use consistent formatting.
      • Try console.log or debugger to find the problem.

Wednesday

  • Further Education
    • Always have something to work on.
      • Lots of small projects are better than one big project.
      • see: jenniferdewalt.com
        • 180 websites
    • Develop the habit of finishing projects/work.
      • It can be very easy to get excited and start something new, but power through to a complete a project to the point you can show other people.
    • Develop a plan with deadlines.
      • Help keep yourself on track.
      • You can't improve what you can't measure.
      • Don't get discouraged if you fall behind, instead think about how you can improve your process.
    • Contribute to open source.
      • Look at github.com/trending to find projects.
      • Delete old issues that are fixed or no longer apply.
      • openhatch.org is a non-profit that matches free software contributors with communities, tools, and education.
    • Strengthen your fundamentals
      • Object-oriented programming (OOP)
      • Algorithms
      • Data structures
    • Learn a backend language
      • Python - regarded as beginner friendly
      • Node.js - leverages JavaScript knowledge
      • Rails - still popular
    • Explore then specialize
      • UX research and design
      • Big Data
      • DevOps
      • AI
      • Mobile
    • Go to Meetups
      • Beer.js
      • Openlate
      • Protonight
      • Women Who Code
    • Don't work for free!
      • Your time is worth something!
      • You have a valuable skill.
      • Take small jobs slightly above your skill level.
      • Be transparent with clients that you are still learning.

Week 10:

EducationElla ChiangComment
Hackbright Front-End Web Development | Week 8

Monday

  • BAAS - Backend as a Service
    • A way to provide mobile and web developers with cloud storage and data processing
    • Firebase and Parse are two companies that offer this
  • Exercises
    • Code appetizer: here.

Wednesday

  • D3 - JavaScript library for data modeling, DOM manipulation using data
  • Exercises
    • Code appetizer: here.

Homework:

Continue working on our portfolio and group projects to present on demo day.

Hackbright Front-End Web Development | Week 7

Monday:

  • JSON
    • JavaScript Object Notation
    • Transport data between servers and applications
    • key:value store
    • XML is a common alternative
    • Can build dynamic websites
  • APIs
    • Application Programming Interface: set of standards for accessing data and interacting with programs
  • Exercises
    • Build a website that generates a random math fact using Numbers API.

Wednesday:

  • Responsive Design
    • Tools: media-query, max-width, min-width, float, percentage widths
    • Media-query lets you write CSS for specific devices. Also cascade and order matters, smaller devices come earlier in the code.
  • Bootstrap
    • Comes with default styling, responsive grid, lots of themes
  • Exercises
    • Format a practice website to make it responsive.

Homework:

Added the last time I did a GitHub commit to my portfolio, also a link to view the last commit in the bottom right hand corner. I used the GitHub API and moment.js.

EducationElla ChiangComment
Hackbright Front-End Web Development | Week 6

Monday:

  • jQuery
    • $ is a function that takes a string or html element as an argument and returns a jQuery object
      • ex: $(“#home”).css(“background”, “red”);
      • $(“p”).addClass(“highlight”);
  • Exercises
    • hide/show divs when link is clicked: see here

Wednesday:

  • AJAX – asynchronous JavaScript and XML
    • allows you to make a call to the server without refreshing the page
  • 200 means ok
  • 400 means bad
  • GET – retrieving value from server
  • POST – posting value to server
  • Exercises

Homework:

  • replace JavaScript in portfolio with jQuery
  • add a class project to the portfolio
EducationElla ChiangComment
Hackbright Front-End Web Development | Week 5

Monday:

  • Labor Day – No Class

Wednesday:

  • event driven programming
    • element.addEventListener(eventcallback);
  • scope is the context in which code is executed
    • var inside a function declares a local variable
  • Exercises
    • make a simple To-Do list
    • code

Homework:

  • There was no assigned homework for this week, however I still worked on improving my portfolio. I added hover effects over the portfolio item images as well as a copy of the Google homepage I did as an exercise for a different curriculum.
EducationElla ChiangComment