Megan Taylor

front-end dev, volunteacher, news & data junkie, bibliophile, Flyers fan, sci-fi geek and kitteh servant

post

JavaScript Code Kata

Dave Thomas was recently on the CodeNewbie podcast and talked about code kata for a few minutes.

A kata is an exercise in karate where you repeat a form many times, making little improvements each time.

kata

The code kata is a way to bring practice sessions into programming.

In my day-to-day work, the problems I solve with JavaScript are not complicated:

  • sticky nav
  • add/remove class based on behavior
  • handle click tracking
  • carousels
  • form validation
  • lightbox

 

So this seems like a great way to stretch my JavaScript legs, so to speak. There are many places online to find code kata; I signed up on Codewars. Even at the beginner and novice levels, I’m working through problems that extend my abilities.

But also, math.

buffyew.gif

 

If you’re interested in doing code kata yourself, LMGTFY. If you happen to sign up on Codewars, I’d love to know so we can compete against each other!

January 27, 2016 | Comments Off on JavaScript Code Kata | Categories: Posts | Permalink

post

Things that happened in 2015

I proposed and helped shepherd changes in tools we use at work for QA and HTML emails.
I planned and executed a field trip for my ScriptEd students to my office, with a lot of help from my awesome coworkers.
I spoke at Career Day at Chelsea Career and Technical Education High School.
I worked on a Chrome extension to help coworkers write presentations in markdown.
Some coworkers and I (wo)manned a table for Career Day at Harlem Village Academies High School.
I spoke about learning web development at Django Girls NYC.
I helped The Story Exchange produce their 1000 Stories project about women entrepreneurs.
I worked on more than 30 websites.
I closed more than 700 tickets at work.
Kyle and I saw Kinky Boots.
I was in the office 2 blocks away when an armed veteran walked into the lobby of a federal building, shot and killed an armed private security guard and then shot himself.
I went to Smorgasburg in Brooklyn and Queens.
Kyle and I went to the Queens Night Market, where Kyle discovered lumpia.
Kyle and I went to an Atlas Obscura event in Greenwood Cemetery.
Kyle and I spent 8 days running around Prague and Southern Germany. We rented a Mercedes and drove >200 MPH on the autobahn. We ate amazing food. We saw beautiful things. We stayed in a hostel.
My family survived my Dad’s hip surgery with minor bickering.
I visited high school friends in the DC area.
Pixel earned the nickname “String Butt” after an emergency trip to the Animal Hospital.
Kyle and I went to the The Rocky Horror Picture Show Experience at the Museum of the Moving Image.
Kyle and I went to the Great Big Bacon Picnic with some of my coworkers.
Kyle and I saw Louis C.K. at Madison Square Garden.
Kyle and I got renters insurance.
I went to the Hamptons for the first time with some great people from ScriptEd.
I played ping pong (badly) with my Mom.
I redesigned the Bummer Bears website to be responsive.
Kyle and I reached the peak of adulthood by buying a frame for our bed.
I learned to like guacamole.
I started lifting weights with a personal trainer.
I went to physical therapy and resolved my back and neck problems.
Kyle and I started saving up to buy a house (someday).

And probably a lot of other stuff I can’t remember right now!

December 31, 2015 | Comments Off on Things that happened in 2015 | Categories: Posts | Permalink

post

Infinite Carousel with jQuery 1.6

I’ve been working on some updates to a site that uses a pretty convoluted and customized combination of JavaScript files, including jQuery 1.6.2. Building an infinite image carousel was an interesting challenge.

JS Bin on jsbin.com

I got a lot of help from these articles:

Making a jQuery infinite carousel with nice features

Create a Simple Infinite Carousel with jQuery

jQuery endless looped slider

I hit an interesting little bug where the browser buffers SetInterval functions, and was able to resolve that with help from this StackOverflow thread: When using setInterval, if I switch tabs in Chrome and go back, the slider goes crazy catching up.

September 10, 2015 | Comments Off on Infinite Carousel with jQuery 1.6 | Categories: Posts | Permalink

post

Pair Programming

During a recent chat with a senior dev at work, I mentioned that I would like to try pair programming. The theory is that I would learn more from working with a more experienced dev than on my own. We had our first pair programming session today.

The project we were working on was just HTML and CSS. The experience was pretty nerve-wracking (having another dev sitting there watching me code feels a lot like public speaking), and I feel like most of what I learned was how inefficient I am. Type type, fix typo, save, refresh in browser, realize Grunt didn’t finish yet and refresh again, check various breakpoints, repeat until expected result accomplished. I’m sure there are some ways I can speed that up. Also, I should turn off all notifications when someone else is staring at my computer screen.

I think I’d get a lot more out of pair programming on JavaScript, which I have much less experience with. In any case, I’m really happy it happened, and am looking forward to more sessions.

August 5, 2015 | Comments Off on Pair Programming | Categories: Posts | Permalink

post

Scale and Center Image in Container

I knew how to do this with a background image, but was really struggling with this earlier today until I found this CodePen.

@import "compass/css3";

body, html {
  width: 100%;
  height: 100%;
  @include box-sizing(border-box);
}

body {
  padding: 1em;
  background: #3498db;
}

section {
  width: 50%;
  height: 15em;
  margin: 0 auto;
  overflow: hidden;
  background: #2980b9;
  @include border-radius(.5em);
  
  img {
    position: relative;
    max-height: 100%;
    left: 50%;
    @include translateX(-50%);
    
    @media(min-width: 800px) {
      top: 50%;
      left: 0;
      max-height: none;
      width: 100%;
      @include translateY(-50%);
    }
  }
}

See the Pen Vertically center image within responsive container by Trevan Hetzel (@trevanhetzel) on CodePen.

August 4, 2015 | Comments Off on Scale and Center Image in Container | Categories: Posts | Permalink

post

ScriptEd Wants YOU to Teach High School Students

ScriptEd is growing! We will partner with 30 schools in NYC beginning this fall, and we’re recruiting volunteers to teach in our partner schools.

ScriptEd is a nonprofit organization that engages software developers on a volunteer basis to teach web development in underserved high schools throughout NYC. Classroom volunteers commit to teach for the entire school year (approximately late September through May) twice a week. Each volunteer is part of a four-person team, and is supported by ScriptEd’s staff members. Learn more.

Interested folks can fill out a volunteer application at bit.ly/ScriptEdVolunteer. A ScriptEd staff member will reach out and schedule a time to discuss the volunteer commitment further once an application is submitted. Trainings for volunteers will be held in late August.

Volunteering with ScriptEd is a great way to meet like minded people while teaching the next generation. We’d love for you to join us!

ScriptEd Background Information

Our Annual Report is here.

Founded in 2012, ScriptEd is a non-profit organization that equips students in under-resourced schools with the fundamental coding skills and professional experiences that together create access to careers in technology.

We bring our tuition-free program directly to schools, where classes are taught by software developers on a volunteer basis. Students apply their new coding skills in paid summer internships where they work with role models in the field as well as gain the experience and confidence necessary to pursue careers in technology.

In its first year, ScriptEd served 27 students in two high schools in Harlem, New York, and placed four of its students in internships at technology firms. Next school year will be ScriptEd’s fourth year in operation, and we aim to serve 600 students across 30 high schools in New York City.

Our student population this year is 44% Black, 34% Hispanic, 18% Asian, 2% White and 2% Other. 88% of our students qualify for free or reduced price lunch (which means their family of four makes less than approximately $40,000 a year). Our internship pool is 44% female and 56% male.

ScriptEd won the Dewey Winburne Community Service Award from South by Southwest, the Judges’ Choice Award in the Millennial Impact Challenge from Huffington Post, the Teach for America Social Innovation Award, the Emerging Innovator Award from American Express, the Tufts’ 100k Challenge Award and both the My Voice Our City Award and the American Dream Award from Ashoka.  ScriptEd has been recognized by the White House as a Champion of Change for Tech Inclusion. The organization has been has been featured in Smithsonian, Time, Huffington Post, CBS, New York 1, Technically Brooklyn and the Chronicle of Philanthropy, and its Executive Director and Founder Maurya Couvares was a featured speaker at TEDxNYED, has been recognized by the New York Business Journal as a ‘Women of Influence‘ and as a Catalyst by the City of New York.

August 3, 2015 | Comments Off on ScriptEd Wants YOU to Teach High School Students | Categories: Posts | Permalink

post

Django Girls NYC Lightning Talk: My Journey to Becoming a Developer

Django GirlsA five-minute speech given at Django Girls NYC on March 27th about my journey to becoming a web developer.

As a child, I took apart appliances in my home to see how they worked. I learned HTML from a boy in my middle school library aide period. I built Geocities websites for the fanfiction my friends and I wrote in high school. But after I saw the required math courses for a computer science major in my college course catalog, I got my degree in journalism.

I thought I couldn’t be a developer because I was so bad at math, I had to take remedial arithmetic in elementary school.

When, as the online editor of the school paper, I helped transition the paper to a new content management system and taught myself how to build simple webpages, I didn’t think of myself as a developer.

Journalism didn’t pan out for me, and I fell back on what I thought of as my meager web skills to pay rent and feed my cats. I figured I could teach myself anything I needed to know, since there were so many resources for learning to code online.

The problem is, before you know about the subject you want to learn, you don’t know what you need to know about the subject. You also can’t distinguish the good resources from the bad.

I read blogs and worked through tutorials and took every free online class I could find. And I kept hitting the same wall, where I wouldn’t know how to solve a problem, or I was getting an error and couldn’t find the solution online, and I would quit working on that project and do something else.

I took on freelance work and used the projects as learning experiences. This was dangerous, because if I failed to finish the work, a) I wouldn’t get paid, and b) it would damage my reputation. But I got lucky, and I learned a few things – HTML, CSS, and WordPress – really well.

When I built WordPress sites for small businesses, managed a national non-profit website and built responsive HTML emails, I didn’t think of myself as a developer. These were all things I taught myself to do through trial and error, or by copying and pasting snippets of code I found online, and bashing my head against a wall until they worked. That wasn’t developing, I thought.

Thinkful Logo

In the fall of 2013, I found out about a program called Thinkful. They were offering a Front-End Web Development class online, but unlike every other online class I had taken, Thinkful taught web development through a series of actual projects designed to teach fundamental programming concepts, and provided one-on-one mentorship. It was also much less expensive than the bootcamps I had seen springing up, and wouldn’t require me to quit my job to spend time learning. I signed up.

I blew through the HTML and CSS portions of the class, and then came JavaScript. JavaScript was my boogeyman. JavaScript was why I wasn’t a real developer.

I learned more in a week with Thinkful than I had in a month when I was learning on my own. The curated curriculum combined with a mentor who works in the industry was exactly what I needed: tell me what I need to learn and help me out when I get stuck.

While learning JavaScript with Thinkful, I built a guessing game, a shopping list app, and a quiz app. My Thinkful mentor was able to provide me with guidance in solving problems and reviewed my code to show me the best practices. Then I built two API-based apps: one to find Farmers Markets in New York City, using the Google Maps API and the Data.gov API,  and one to find out the length of time of a person’s commute, and then give them just enough news stories to read during that time, using the Google Maps API to estimate transit time and the NYTimes API to grab articles.

Thinkful showed me that I actually knew more than I thought in a lot of ways, but learning it in a formal way with proper terminology really helped my confidence and abilities.

Shortly after completing the course, I got my dream job as a front-end developer at an awesome company. I’m finally a developer.

Looking back though, I was a developer from those first experiments in middle school. Maybe not a very good one, and certainly a novice, but still a developer.

I still have days when I’m sitting at my computer, hitting keys and thinking “I have no idea what I’m doing!” But I’ve gotten comfortable with that. No matter what level of programming you reach, you are always going to encounter languages and bugs and frameworks that leave you feeling like a beginner all over again. Technology changes faster than we can learn. The key is to take a deep breath and get started. I’m still pretty bad at math, though.

March 27, 2015 | Comments Off on Django Girls NYC Lightning Talk: My Journey to Becoming a Developer | Categories: Posts | Permalink

post

How to add an SSH key to your computer

I spent an embarrassingly long time the other day trying to remember how to add an SSH key to my computer. The problem was that everything Google came back with involved generating an SSH key, where I had one that I needed to store on my machine so that I could get access to a server. So here are the steps I would’ve liked to find the other day:

1. Type cd into the command line to get to home folder.
2. Type cd .ssh to get into ssh folder
3. Type sublime keyfilename, where sublime can be any editor and keyfilename is whatever you want to name the key file.
4. Copy and paste the key into the file and save.
5. Profit.

March 20, 2015 | Comments Off on How to add an SSH key to your computer | Categories: Posts | Permalink