1 of 22

Front page to front-end

#jstl2017

2 of 22

Howdy.

Andrew Nguyen is a front-end developer at the St. Louis Post-Dispatch where he builds news apps and interactives.

Twitter: @onlyandrewn

Josh Renaud designs print pages and codes interactive projects for the St. Louis Post-Dispatch.

Twitter: @Kirkman

3 of 22

Who is this session for?

Are you passionate about code and design?
Have you tried teaching yourself how to code?
Or you just don’t know where to start?

This session is for you.

4 of 22

What path did you take?

Caption: Josh back in the day spending time with his Atari 520 ST on a bbs.

What path did you take to get to where you are today?

A: I’m originally from Toronto, Canada and my path in journalism is probably best described as meandering. In my senior year of university I got the opportunity to do internships at two daily newspapers: one at the small, now defunct daily paper called Guelph Mercury and another in western Canada called the Winnipeg Free Press. After graduating from university, I began as a fact checker for the national Walrus magazine and then joined my hometown paper, the Toronto Star, as a crime and breaking news reporter right around the time that the Rob Ford crack cocaine scandal made headlines. I moved back to Ottawa, the nation’s capital, for a bit as a general assignment reporter and after my contract expired I decided to take a leap of faith and three-month coding bootcamp and that’s when things really changed for me. At my last job, I worked as a jack-of-all-trades at the Brandon Sun. Then six months ago I joined the team at the St. Louis Post-Dispatch, and I really couldn’t be happier.

J: I grew up in St. Louis, and graduated from Hazelwood West. Throughout high school and college, I thought I would end up as a writer or a reporter. But the doors that opened for me were on the design side, and so that's what I pursued. My first opportunity came as a sports design intern at the Post-Dispatch. Eventually I was able to win a job there, and I still work there today. Over the years I have also done freelance work as a web designer. Because of that, six years ago my bosses at the P-D encouraged me to become a part-time newsroom developer. These days I split my time between working on interactive projects and designing the Sunday and Monday print editions of the newspaper.

5 of 22

Caption: Josh back in the day spending time with his Atari 520 ST on a bbs.

What path did you take to get to where you are today?

A: I’m originally from Toronto, Canada and my path in journalism is probably best described as meandering. In my senior year of university I got the opportunity to do internships at two daily newspapers: one at the small, now defunct daily paper called Guelph Mercury and another in western Canada called the Winnipeg Free Press. After graduating from university, I began as a fact checker for the national Walrus magazine and then joined my hometown paper, the Toronto Star, as a crime and breaking news reporter right around the time that the Rob Ford crack cocaine scandal made headlines. I moved back to Ottawa, the nation’s capital, for a bit as a general assignment reporter and after my contract expired I decided to take a leap of faith and three-month coding bootcamp and that’s when things really changed for me. At my last job, I worked as a jack-of-all-trades at the Brandon Sun. Then six months ago I joined the team at the St. Louis Post-Dispatch, and I really couldn’t be happier.

J: I grew up in St. Louis, and graduated from Hazelwood West. Throughout high school and college, I thought I would end up as a writer or a reporter. But the doors that opened for me were on the design side, and so that's what I pursued. My first opportunity came as a sports design intern at the Post-Dispatch. Eventually I was able to win a job there, and I still work there today. Over the years I have also done freelance work as a web designer. Because of that, six years ago my bosses at the P-D encouraged me to become a part-time newsroom developer. These days I split my time between working on interactive projects and designing the Sunday and Monday print editions of the newspaper.

6 of 22

Why did you choose journalism?

What made you want to go into journalism?

A: I think I found journalism pretty late in high school, or maybe it found me, but everyone around me at my high school seemed to know exactly what they wanted to do and had elaborate five- and ten-year plans of how they going to achieve it. Depending on what point in high school you might of asked me this question I could have easily ended up in a completely different field like urban planning or astronomy, but I had some amazing teachers in high school who were all incredibly supportive and really fostered my love of writing. I was a pretty decent writer and oddly enough journalism, especially being a reporter out in the field felt complete opposite of what my personality is — reserved, a bit shy.

J: As far back as I can remember, I always thought of myself as a writer. I did a lot of writing in high school. Things really clicked when I joined my high school paper. My classmates named me "journalist of the year." After Hazelwood West, I attended UMSL here in town. UMSL doesn't have a journalism program, but what it does have is a great weekly paper where you can do pretty much everything. Over the years I worked as a reporter, a web editor, a production manager, and eventually the editor in chief. Working on my college paper and challenging the status quo really solidified my desire to make this a career.

7 of 22

What made you want to go into coding?

What made you want to code?

What made you want to go into coding?

A: For years I had been interested in graphic design and even dabbled in coding in elementary school when I played Neopets and you had to design your pet’s page. I really loved pulling back the curtain and looking at the code to see how it was built and to see if I could recreate it. For those in the audience who are on the fence about going into coding, I think for a lot of people fall into the trap of convincing themselves that learning to code is too challenging. Making that change was a really big decision at the time, but it was probably the best decision I ever made. For me, I really like the idea of taking the thing you do in your spare time and make it the thing you do all the time. I’m surrounded by an incredibly supportive team and having these skills allows me to approach telling stories in a different way.

The Road Not Taken by Robert Frost (excerpt)

“Two roads diverged in a wood, and I—

I took the one less traveled by,

And that has made all the difference.”

J: Okay, I'm old. I grew up during the 8-bit and 16-bit generation of computers. I remember sitting on the living room floor with an Atari 800 computer hooked up to a television, typing in BASIC programs from a magazine line by line. I dabbled in BASIC at home and at school. I was able to make simple stuff like a very rudimentary word processor or a choose-your-own-adventure game, but I didn’t go much further. My junior high and high school years were the 1990s, the advent of the web, so naturally I began building websites. But I was focused on web design, not programming or coding. I figured I didn't know enough to be a programmer. But I found out later that I was capable of much more than I ever thought.

8 of 22

How did you transition into coding?

Caption: Andrew at work at the scene of a broken watermain.

How did you transition from your previous role to the one you have now?

A: I’ve done the gamut — general assignment reporting, the arts and culture beat, crime and breaking news, courts reporting, federal and provincial elections, fact checking and even photography at one point — but it was the coding bootcamp that really helped provide me with a great introduction to coding and I focused on producing very small projects that could be completed in a week in order to transition my portfolio from just written clips and some multimedia to actual code.

J: About six years ago, a member of our "multimedia" team at the P-D left to take a new job. My bosses knew I was computer savvy, and they tried to talk me into transitioning into splitting my time between print design and developing interactive projects. As I said earlier, at the time I didn't think of myself as a programmer. I had become familiar with web scripting languages like Perl, PHP, and Javascript, and I had learned how to make small tweaks to other people's plugins. But if you had asked me to write my own app from scratch, I wouldn't have known where to start. But I was selling myself short. My bosses and coworkers saw something in me that I was blind to myself. So I took a leap of faith, and I quickly discovered that I was capable of making really cool projects. The learning curve was not near as steep as I feared it would be.

9 of 22

Caption: Andrew at work at the scene of a broken watermain.

How did you transition from your previous role to the one you have now?

A: I’ve done the gamut — general assignment reporting, the arts and culture beat, crime and breaking news, courts reporting, federal and provincial elections, fact checking and even photography at one point — but it was the coding bootcamp that really helped provide me with a great introduction to coding and I focused on producing very small projects that could be completed in a week in order to transition my portfolio from just written clips and some multimedia to actual code.

J: About six years ago, a member of our "multimedia" team at the P-D left to take a new job. My bosses knew I was computer savvy, and they tried to talk me into transitioning into splitting my time between print design and developing interactive projects. As I said earlier, at the time I didn't think of myself as a programmer. I had become familiar with web scripting languages like Perl, PHP, and Javascript, and I had learned how to make small tweaks to other people's plugins. But if you had asked me to write my own app from scratch, I wouldn't have known where to start. But I was selling myself short. My bosses and coworkers saw something in me that I was blind to myself. So I took a leap of faith, and I quickly discovered that I was capable of making really cool projects. The learning curve was not near as steep as I feared it would be.

10 of 22

What is a normal day at the paper like?

What does a “normal” day at the paper look like for you?

A: Working in journalism means that everyday is a bit of a grab bag. We’ll often juggle a variety of projects based on what editors need from us. The two of us bounce around from department to department as opposed to sticking to a specific beat. We work on maps, charts as well as bigger, more ambitious projects that take weeks, sometimes months, to produce, but what I enjoy the most about my day is being on a team and getting to collaborate with some extremely smart people like Josh over here.

J: For me, the beauty of my job is that I don't have a normal day. One day I'm cropping photos, helping to write headlines, and designing the front page. The next day I'm writing a script that will show a Missouri map with live vote totals from around the state. Some days I work against the thrill of deadline news, other days I'm able to dive deep on a long-term project. When I'm developing interactives, I might be working with news, features, sports, or editorial. Maybe the topic is serious; maybe it's fun. You never know. For me, variety is the spice of life.

11 of 22

Let’s talk about some projects.

Projects

12 of 22

STL100

https://graphics.stltoday.com/apps/stl100-2017/

https://m.me/stlian100

Built using an open-source tool from NPR
Highlights our food critic’s unique take on restaurants
Big, bold photos
Added features each year: Filters, location, map, chatbot

13 of 22

14 of 22

Crime Tracker

https://graphics.stltoday.com/apps/crime/

Our data reporter built a script to crunch the numbers
We take great care to give a lot of context
Updates monthly
Want to expand to county, but fragmentation is tough

15 of 22

16 of 22

Municipalities: The Game

http://bit.ly/stlpdcounty

Game where readers race the clock to type muni names
Had a scoreboard to add element of competition
Took a dry topic (fragmentation) and made it fun

17 of 22

18 of 22

How can you get into coding?

Start small
Set a weekly deadline
Spend time actually coding
Ask questions often
Copy, copy, copy
Follow your passion

How can I get into coding?

A: This is the question I get asked the most and here are three tips:

Start small. Being brand new to the world of coding means it can feel overwhelming so the best way to combat this is to find something that you are interested in and build it.
Set a weekly deadline for yourself and make a habit of carving out some time for yourself in the evening where you can either work on a project, read or do some coding tutorials.
And my last tip is that you have to park your butt in your chair and actually do the work. Learning to code is a marathon, not a sprint. Even for the two of us who’ve been doing this for a while and we are constantly learning new things.

J: Here are three more tips for good measure:

Ask questions often. I learned how to code by consulting Google and Stack Overflow. I still use those tools many times a day when I run into roadblocks. It's almost certain that someone else in the past had dealt with the same problem you face.
Copy, Copy, Copy. If you come across a cool technique, copy it. Learn Javascript by tinkering with the source code for websites you like. Learn Python by rummaging through GitHub repositories and tweaking other people's code.
Follow your passion. Write a little script or app that does something YOU are interested in. At home, I write little games and indulge my retrocomputing hobby. The things I learn at home doing those fun personal projects help sharpen my skills at the office.

19 of 22

What makes a good coder?

20 of 22

Handy advice

21 of 22

Questions?

22 of 22

http://bit.ly/jstl2017coding