Loading…
CSS Dev Conf 2017 has ended
View analytic

Sign up or log in to bookmark your favorites and sync them to your phone or calendar.

Sunday, October 8
 

5:30pm

Welcome Reception

Bring your photo ID or registration receipt to pick up your badge and goody bag. Stick around for a drink, some snacks and Photo Booth shenanigans with your fellow attendees. Watch the French Quarter light up for the night as you meet up with friends old and new before heading out to dinner. 


Sunday October 8, 2017 5:30pm - 7:30pm
Royal Salon Hotel Monteleone
 
Monday, October 9
 

7:30am

Check-in

If you haven’t already picked up your badge, bring your photo ID or registration receipt to pick up your badge and goody bag. 


Monday October 9, 2017 7:30am - 9:00am
Queen Anne Lobby Hotel Monteleone

8:00am

Breakfast

Monday breakfast options include fresh-squeezed fruit juices, fruit smoothies, house-made muesli, oatmeal with all the trimmings, fresh-fruit skewers, bagels with cream cheese and peanut butter, fresh breads including gluten-free options, and plenty of coffee and tea to lift the fog of morning


Monday October 9, 2017 8:00am - 9:00am
La Nouvelle Orleans East & West Rooms Hotel Monteleone

9:00am

Opening Keynote — Mina Markham
Speakers
avatar for Mina Markham

Mina Markham

Senior Engineer, Slack


Monday October 9, 2017 9:00am - 9:30am
Queen Anne Ballroom Hotel Monteleone

10:00am

Introducing a Design System to a Legacy Product #legacy
Imagine a product that has been on the market for a number of years without having a designer employed. How can you, as a newly-hired front-end designer, introduce a face-lift and design system without completely interrupting an existing workflow?
  • Explaining the value of a design system to your team
  • Identifying current problems
  • Creating scalable and modular solutions to those problems
  • Getting everyone on board and contributing to the new design system
  • Simultaneously dumping the old and using the new

Monday October 9, 2017 10:00am - 11:00am
Orleans Room Hotel Monteleone

10:00am

Removing Unwanted CSS #unwantedCSS
The future of web development and build tools like webpack promise new and exciting ways to manage our CSS and only deliver exactly the necessary styles for the components on the screen. But right now today, we're still working on lots of projects using build tools like gulp and frameworks like bootstrap that come with a lot of styles we might not use but end up serving to every page.

After this session, you'll have some great ideas and familiarity with tools to help you trim down your unwanted CSS. Tools include: 
  • Gulp + Sass and the usual suspects 
  • UnCSS to check views against Sass/CSS 
  • PostCSS and ByebyeCSS to list selectors we want to be removed 
  • Some browser and command line tools and tips to measure and test CSS performance

Speakers
avatar for Chris Hawkins

Chris Hawkins

Base Two
Chris Hawkins started making websites as a teenager, back before high speed was a thing, and in a world where a little bit of CSS made you a forum hero. Today's landscape is a lot more demanding of developers to have a deep understanding of various technologies while remaining in... Read More →


Monday October 9, 2017 10:00am - 11:00am
Iberville Room Hotel Monteleone

10:00am

Women in Tech Q&A #womentech


Speakers
avatar for Jackie Balzer

Jackie Balzer

Head of Front End Development, Behance, Adobe
avatar for Maryann Bell

Maryann Bell

Creative Technologist, Adobe
avatar for Ari Stiles

Ari Stiles

Conference Producer, Environments for Humans


Monday October 9, 2017 10:00am - 11:00am
Queen Anne Ballroom Hotel Monteleone

10:45am

Morning Break

Sweet treats and fresh fruit to help you get through the morning. Served at break stations.


Monday October 9, 2017 10:45am - 11:15am
TBA

11:00am

Don't Use My Grid System (Or Any Others) #gridsys
Speakers
avatar for Miriam Suzanne

Miriam Suzanne

Founder, OddBird
Miriam Suzanne is an author, performer, musician, designer, and web developer — working with OddBird, Teacup Gorilla, CSS Tricks, and anyone who loves open-source collaboration. She’s the author of Riding SideSaddle* and The Post-Obsolete Book, co-author of Jump Start Sass an... Read More →


Monday October 9, 2017 11:00am - 12:00pm
Orleans Room Hotel Monteleone

11:00am

Element-first design with context-aware CSS #contextcss
Typically, "responsive" development is bound to viewport characteristics. Wouldn't it be great if we could style elements to "do the right thing" based on their own width or height, without having to care about the width or height of the browser?

Speakers
MR

Michael Rog

Build For Humans
Michael runs a small dev team in Texas. Code is his happy place. He wants to be a teacher when he grows up. When not programming, he cooks with friends, travels all over the place, sings in the shower, and trains with the local circus.


Monday October 9, 2017 11:00am - 12:00pm
Queen Anne Ballroom Hotel Monteleone

11:00am

Slaying Your Webpack Dragon #webpack
Complex, mystical, magical… these are some of the words associated with webpack. It is an incredibly powerful technology which can seem ever-so-daunting at first glance, but really it is centered on a few straightforward concepts.

In this session, I will demystify webpack by focusing on those core principles and explaining why it will be a worthy addition to your front-end toolchain.

From Grunt to Gulp to Webpack.
* What is webpack?
* Why do we need it?

Core Principles
* Entries & Outputs
* Loaders
* Plugins 

Focus on the CSS pipeline with webpack
* Style, CSS, PostCSS, etc. loaders
* Handling static assets
* Extracting CSS into a separate file using the ExtractTextWebpackPlugin

Code splitting 101 
How to get started with the webpack bundle analyzer

Speakers
avatar for Varun Vachhar

Varun Vachhar

developer, Rangle.io
Varun Vachhar is a developer with a strong focus on design, interactivity and animation. Originally from New Delhi, he currently lives in Toronto and works as a developer at Rangle.io. In his spare time, he likes to experiment with creative coding and making playful experiences f... Read More →


Monday October 9, 2017 11:00am - 12:00pm
Iberville Room Hotel Monteleone

12:00pm

FLIPping Out About Animated Layouts #flipanim
Say goodbye to jump cuts on the web! In this session, you'll discover what makes native apps feel so alive and how we can replicate those movements on the web. Learn how the FLIP technique can smoothly transform flexbox- and grid-based layouts at 60FPS. We'll dive into basic and advanced techniques for animating between states in many different situations with interactive demos.

Why animate layouts (+ many examples)
How native apps transition: 
  • Android's Shared Element Activity Transitions 
  • iOS's Layout Constraint Animations 
The FLIP technique (First, Last, Invert, Play)
  • using the Web Animations API 
  • using GSAP 
Additive, interruptible & physics-based FLIP animations
Choreographing FLIP animations
Motion curves (a la Material Design)
Tools, libraries & resources

Speakers
avatar for David Khourshid

David Khourshid

Frontend Engineer, Microsoft
David Khourshid is a Florida-based web developer for Microsoft, a tech author, and speaker. Also a fervent open-source contributor, he is passionate about JavaScript, CSS, animation, innovative user interfaces, and cutting-edge front-end technologies. When not behind a computer k... Read More →


Monday October 9, 2017 12:00pm - 1:00pm
Queen Anne Ballroom Hotel Monteleone

12:00pm

Light Speed Web with Progressive Web Apps #progapps
WHAT DO PEOPLE LOVE ABOUT APPS? Fast load time, quick navigation within an application, ability to interact even when you are offline and push notifications. You can have all of these features and NOT require users to download an app. Progressive Web Apps for mobile web with Service Worker come along to save your life!

Outline:
  • Overview of Progressive Web Apps 
  • User Experience with Progressive Web App 
  • How it Works: Web Sockets 
  • Push Notifications

Speakers
avatar for Julia Konivestska

Julia Konivestska

Front End Engineer, Wayfair
Iuliia has been developing user-friendly front-end experiences, including data visualizations, since 2004. After realizing that computer engineering allowed her to blend an interest in art and design with technology and science, she pursued a B.S. in Computer Science and M.S. in... Read More →


Monday October 9, 2017 12:00pm - 1:00pm
Iberville Room Hotel Monteleone

12:00pm

Variable Fonts #scaletype
Typography is the most important aspect of great design and UX, but can’t come at the expense of performance or we risk our designs never being seen. Variable fonts are coming, and will change everything: with a single font file that can scale in size, width, weight and even x-height—exactly as the type designer envisioned—all controllable via CSS.
  • What are variable fonts, and when can they be used 
  • Why type is the voice of your words, and how that voice just became a chorus 
  • How to expand the dynamic range of your design with type 
  • Where to be restrained and when to experiment: think character widths on small screens, or even responding to ambient light with stronger character weights

Speakers
JP

Jason Pamental

Isovera
Jason is Senior Director of Design and Technical Strategy at Isovera (isovera.com), where he heads the design and development team, leads workshops, and works with clients establishing their digital strategy. Seasoned design and strategy leader with 20+ years’ experience on the... Read More →


Monday October 9, 2017 12:00pm - 1:00pm
Orleans Room Hotel Monteleone

1:00pm

Lunch

Lunch is on your own, so grab some new friends and try that local restaurant your friend told you to try. 

Here are some nearby recommendations:

Hotel Monteleone's Criollo Restaurant
214 Royal StNew Orleans, LA 70130
$$$
American (New), Cajun/Creole, Breakfast & Brunch 
Yelp: ⭐⭐⭐⭐
http://criollonola.com/

 

Johnny’s Po-Boys
511 St. Louis St., New Orleans, LA 70130
A very popular, tiny shop, serving GIANT Po-Boy sandwiches and traditional sides
Yelp: ⭐⭐⭐½
http://www.johnnyspoboy.com


Green Goddess Café
307 Exchange Pl, New Orleans, LA 70130
Vegetarian-GF
$$
Creative New American cuisine & cocktails. Healthy Options. Great dessert.
Yelp: ⭐⭐⭐⭐
http://www.greengoddessvt.com/

 

Café Fleur-De-Lis
307 Chartres St, New Orleans, LA 70130
$$
Casual, narrow café featuring quick, counter-serve breakfast & lunch with ample portions.
Yelp: ⭐⭐⭐⭐
http://www.cafefleurdelis.com/

 

Mena’s Place
200 Chartres St, New Orleans, LA 70130
$$
Longtime place serving Cajun fare like omelets, po’boys & seafood platters for breakfast and lunch.
Yelp: ⭐⭐⭐⭐
http://menaspalace.com/

 

Backspace Bar & Kitchen
139 Chartres St, New Orleans, LA 70130
Veg Options available
$$
Exposed-brick literary-themed spot with a fireplace. Bar food.
Yelp: ⭐⭐⭐⭐
http://www.backspacenola.com/

 

The Jimani
141 Chartres St, New Orleans, LA 70130
Veg options available.
$$
Sport bar with multiple TVs. Pub fare serve late.
Yelp: ⭐⭐⭐½
http://www.thejimani.com/

 

Felipe’s Mexican Taqueria
301 N Peters St, New Orleans, LA 70130
Veg options available
$$
Mexican & Latin food in a casual counter-serve eatery.
Yelp: ⭐⭐⭐⭐
https://www.felipestaqueria.com/

 

Huck Finn’s Café
135 Decatur St, New Orleans, LA 70130
Vegetarian options available.
$$
New Orleans fare – sports pub – lots of TV’s.
Yelp: ⭐⭐⭐½
http://www.huckfinnscafe.com/

 

Creole House Restaurant & Oyster Bar
509 Canal St, New Orleans, LA 70130
$$
Bright, casual restaurant serving classic Cajun-Creole dishes & seafood platters.
Yelp: ⭐⭐⭐⭐
http://creolehouserestaurant.com/

 

Palace Café
605 Canal St, New Orleans, LA 70130
$$ - $$$
Modern Creole cooking in an opulent, high-ceilinged room plus sidewalk seating.
Yelp: ⭐⭐⭐⭐
http://www.palacecafe.com/

 

Welty’s Deli
336 Camp St, New Orleans, LA 70130
Vegetarian options available.
$$
Breakfast & lunch spot serving sandwiches and salads with New Orleans flavor.
Yelp: ⭐⭐⭐⭐½
http://www.weltysdeli.com/

 

Red Gravy
125 Camp St, New Orleans, LA 70130
Vegetarian options available.
$$
Handmade pasta & other traditional Italian staples.
Yelp: ⭐⭐⭐½
http://redgravycafe.com/

 

Mr. B’s Bistro
201 Royal St, New Orleans, LA 70130
$$
Modern, seasonal Louisiana fare in a refined, wood paneled space.
Yelp: ⭐⭐⭐⭐
http://www.mrbsbistro.com/

 

Acme Oyster House
724 Iberville St, New Orleans, LA 70130
$-$$
Lively New Orleans based chain offering oyster, po’boys, gumbo & other Cajun-Creole classic.
Yelp: ⭐⭐⭐⭐
http://www.acmeoyster.com/

 

Red Fish Grill
115 Bourbon St, New Orleans, LA 70130
$$-$$$
Seafood & Cajun favorites including oysters in a funky & lively space.
Yelp: ⭐⭐⭐⭐
http://www.redfishgrill.com/

 

Felix’s Restaurant & Oyster Bar
739 Iberville St, New Orleans, LA 70130
$$
Local seafood platters, fresh-shucked oysters & Creole staples in a casual barroom setting.
Yelp: ⭐⭐⭐⭐
http://www.felixs.com/

 

The Ruby Slipper Café
1005 Canal St, New Orleans, LA 70112
Vegetarian options available.
$$
Cheery café serving signature omelets, Southern brunch fare & cocktails in a relaxed atmosphere.
Yelp: ⭐⭐⭐⭐
https://www.therubyslippercafe.net/

 

Café Beignet
311 Bourbon St, New Orleans, LA 70130
Vegetarian options available.
$-$$
Charming, counter-serve café with menu of beignets, Cajun & breakfast fare, plus patio seating.
Yelp: ⭐⭐⭐½
http://www.cafebeignet.com/

 

GW Fins
808 Bienville St New Orleans, LA 70112
Vegetarian and Gluten Free options available.
$$
Creative, ever-shifting seafood menu featuring fresh catches in a stylish updated warehouse space.
Yelp: ⭐⭐⭐⭐½
http://gwfins.com/


Starbucks
500 Canal St, New Orleans, LA 70130
Yelp: ⭐⭐⭐½


Monday October 9, 2017 1:00pm - 3:00pm
TBA

3:00pm

From Braces to Pixels #bracespxs

CSS feels like magic at times, doesn't it? By understanding how it works, we can not only demystify the magic, but we can improve our sites in real and practical ways. In this talk, we'll take a look at CSS from the perspective of the rendering engine, to peek behind the curtains and take a deep look at how the layout engine handles converting your CSS into pixels on the screen.


Speakers
avatar for Greg Whitworth

Greg Whitworth

Greg Whitworth is on the Layout team of Microsoft Edge and an avid advocate of enriching the web platform to empower web developers. He is a member of the W3C CSS Working Group, the CSS Houdini Task Force. He really enjoys trying to go after interop between web browsers in hopes... Read More →


Monday October 9, 2017 3:00pm - 4:00pm
Orleans Room Hotel Monteleone

3:00pm

Let’s Talk Burnout with Dave Rupert #burnout

The tech industry regards burnout like a weird badge of honor. Dave Ruperts holds a roundtable conversation to talk about burnout in the tech industry--bring your stories and ideas how to stop it. 


Speakers
avatar for Dave Rupert

Dave Rupert

I'm Dave Rupert, the lead developer of Paravel. I co-hostShopTalk with Chris Coyier, it's a sound effects podcast that also covers web development. I also co-host the ATX Web Show, a podcast about the web design and development scene in Austin, TX. On the internets I’mdavatron500... Read More →


Monday October 9, 2017 3:00pm - 4:00pm
Iberville Room Hotel Monteleone

3:00pm

Ride the Lightning (Making Fast Websites) #fastsite
Speakers
avatar for Matt James

Matt James

CX Interaction Designer, Wells Fargo Advisors
Matt James is a front end developer from St. Louis, MO who works for a major financial institution helping, to make their public facing sites performant, device agnostic and accessible. He followed a long and winding road through photography, the cycling industry, personal traini... Read More →


Monday October 9, 2017 3:00pm - 4:00pm
Queen Anne Ballroom Hotel Monteleone

3:45pm

Afternoon Break

Your chance to ward off the afternoon slump! With chips and dips, baked pretzels and even some cookies! 


Monday October 9, 2017 3:45pm - 4:15pm
Queen Anne Parlor Hotel Monteleone

4:00pm

Design Systems 2.0: Creating Consistent Interfaces #designsys2

HTML and CSS are all you need to create a Design System that unifies the visual appearance of your products, but as soon as you want to create consistent behavior between applications, you'll need to turn to JavaScript. More often than not, using a modern framework such as React, Vue, or Angular will save you lots of time, and keep you from reinventing the wheel.

 In this talk, I will discuss how moving interactivity into the Design System is not only a good choice today, but is most certainly how you will be creating Design Systems in the future. I'll also be discussing the React-powered Design System I've been helping to create which powers a few apps you might have heard of, including SharePoint, OneDrive, and Outlook for the web.


Speakers
avatar for Micah Godbolt

Micah Godbolt

Senior Design Developer, Microsoft
I'm a Front-end Architect, author, speaker, trainer, blogger and developer from the Seattle area.


Monday October 9, 2017 4:00pm - 5:00pm
Queen Anne Ballroom Hotel Monteleone

4:00pm

Non-traditional Layouts with CSS #csslayouts
This session will share tips and techniques on how to bring the classic graphic design movements such as de Stijl, Bauhaus, Swiss International, and pop art to web design. We will break the traditional grid to create bold, dynamic layouts by drawing inspiration from great design icons such as Alexey Brodovitch, Herbert Bayer, Joseph Müller-Brockmann, Roy Lichtenstein and others.

Speakers
avatar for Wendee Fiorillo

Wendee Fiorillo

Crisp fall morning, ah. Works on IE7 bug. Dreams of a sunset.
To some Wendee Fiorillo is a designer, a front-end architect, a digital problem solver. To others Wendee is an artist, a baker of cookies, a weirdo who takes pictures of spiders.


Monday October 9, 2017 4:00pm - 5:00pm
Iberville Room Hotel Monteleone

4:00pm

The Transformation of the Transform #transform
While CSS Transforms have been helping us position and animate for years, they are gaining new life as CSS grows. We'll get creative with Transforms and their related properties by taking a look at some of their lesser known aspects, digging into 3D, and exploring how they can be combined in interesting ways with newer tools like CSS Variables. There will be a tiny bit of math... but it's totally the fun kind.

Key topics:
  • Using CSS Variables to separate out the transform functions effectively as independent properties 
  • Thinking in three dimensions 
  • Gaining a deeper understanding of 3D perspective 
  • To will-change or not to will-change? 
  • How Transforms are beneficial for animation 
  • What's next in the specification

Speakers
avatar for Dan Wilson

Dan Wilson

Mutual Mobile
Dan is a Front End Developer from Austin, TX. While he loves working in browsers of all sizes, he also spends his time in hybrid mobile apps and the "no screen" world of microcontrollers.


Monday October 9, 2017 4:00pm - 5:00pm
Orleans Room Hotel Monteleone

5:00pm

Building a CSS pipeline using npm #cssnpm
Much like JavaScript and ES6, tools exist that allow developers to use future CSS syntax today. CSS pre-processors don't exactly focus on this feature and indeed its possible to totally ditch these in favor of a build pipeline built around npm.

This presentation will cover:
  • Initialization 
  • Setup using PostCSS + CSSnext 
  • Build a style framework using CSS4 features 
  • ...cover css variables, native import, color functions, em/rems, other fun stuff?
  • Create a development setup with live-reload 
  • Publish to npm
  • CCreate docs for your consumers

Speakers
avatar for Carlos Filoteo

Carlos Filoteo

Front-end Developer, AncestryDNA
Carlos is a front-end developer at Ancestry. He enjoys learning new things slowly, and sharing lessons learned.


Monday October 9, 2017 5:00pm - 6:00pm
Orleans Room Hotel Monteleone

5:00pm

Style Guides, Languages, and the Tale of the Million Dollar Button #1Mbutton
How can designers and developers communicate better? Sometimes it feels like we are speaking completely different languages. Our team has tackled this problem head-on and worked hand-in-hand to solve it. We’ve recently taken a second pass at our style guide to evolve it into a Design Language System. This system has broken down language barriers between design, engineering, and product.

In this talk, I will share how we employed User Research techniques like task analysis and think aloud to pressure test our style guide and refine its development to increase productivity set the stage for one of the most successful AB tests in company history.

Speakers
avatar for Vincent Nalupta

Vincent Nalupta

Senior Software Engineer, Grubhub
Vincent Nalupta has been in love with coding for the visual web since the days of the font tag. He's been tiptoeing the line between design and development ever since. He went on to build front end interfaces for companies like ESPN, J.Crew and Madewell. He now spends his days wr... Read More →


Monday October 9, 2017 5:00pm - 6:00pm
Iberville Room Hotel Monteleone

5:00pm

Using CSS Grid in the Real World #realgrids
The new CSS Grid specification is here! Sure, it's fun to play with, but is it truly ready or even practical to use for everyday work? As a designer and front-end developer at a software development agency, I've been using CSS Grid in production websites and it is already making my life easier. In this talk, I'll show you some examples that will include:
  • Layouts achieved with a few lines of code that previously required messy hacks or JavaScript - Examples of different syntax and units for CSS Grid 
  • Fallbacks for older browsers 
  • How CSS Grid improves accessibility

Speakers
avatar for Brenda Storer

Brenda Storer

Designer & Front End Developer, thoughtbot
Brenda is a Silicon Valley native who moved to NYC to escape the tech world, only to discover that tech is actually pretty awesome. She is currently a designer and front end developer at thoughtbot, teaches HTML/CSS with Girl Develop It, and specializes in belting out 80's hair m... Read More →


Monday October 9, 2017 5:00pm - 6:00pm
Queen Anne Ballroom Hotel Monteleone

7:15pm

French Quarter Parade & Guided Tours

Join your fellow attendees, conference speakers, and a few surprise guests as we walk a short parade route through the French Quarter. We’ll be escorted by a second-line jazz band along with New Orleans’ Finest. Costumes and jugglers are welcome! 

We’ll finish the parade at Jackson Square, where tour guides will be waiting to take you on a variety of themed walking tours. Due to the limited number of spots for tours: first come, first serve. You will need your CSS Dev Conf Wristband or official badge in order to go on a tour.

After the tour, your guide will at Café du Monde for beignets and conversation.


Monday October 9, 2017 7:15pm - 10:00pm
Queen Anne Lobby Hotel Monteleone

8:45pm

CSS Dev Conf Dribbble Meetup

Stop by after your tour or after dinner for dessert and coffee at a New Orleans institution. Local Dribbblers are welcome, too! 



Monday October 9, 2017 8:45pm - 10:00pm
Café Du Monde 800 Decatur Street
 
Tuesday, October 10
 

8:00am

Breakfast

Tuesday breakfast includes fresh-squeezed fruit juices, fresh fruit and berries, yogurt, an assortment of cereals, biscuits and sausage, croissant breakfast sandwiches, and all the coffee and tea you need to get going.


Tuesday October 10, 2017 8:00am - 9:00am
La Nouvelle Orleans East & West Rooms Hotel Monteleone

9:00am

Keynote Address — Harry Roberts
Tuesday October 10, 2017 9:00am - 10:00am
Queen Anne Ballroom Hotel Monteleone

10:00am

Obscure CSS to Solve Common CSS Problems #obscurecss

If you think outside the box, you can solve almost anything with CSS. Join Estelle Weyl to learn the power of CSS, as she solves several CSS WTFs. Depending on your perspective, that can mean “wonderfully terrific feature” or, very often, “what the @#$%!.” Once you realize the power of CSS, you’ll want to jump back into it (instead of relying on frameworks that were necessary when few knew how to support IE6-8).

Topics may include:

  • Vertical centering many ways
  • Nifty tricks, like counting form errors, that can be done with generated content (sans JavaScript)
  • CSS selector madness, including stupid pet tricks like #myId#myId to overwrite third-party CSS, attribute selectors, and picking the item that is the seventh to last from a list, or something like that
  • Understanding specificity, inheritance, and the cascade
  • Overwriting !important without killing specificity and avoiding !important by using the above mentioned stupid pet tricks
  • Animation, including using animation sprites to create the appearance of someone dancing, riding a bike, or something equally entertaining
  • Shaping images and making text flow around them
  • Reducing transparent PNG file size by using CSS masking
  • Using iconography in an accessible manner
  • A CSS only modernizr (no JS necessary)
  • Two different ways of creating a slide deck that works without JS and how to make it more accessible

Speakers
avatar for Estelle Weyl

Estelle Weyl

Open Web Evangelist, UI Eng., Author, Trainer, Instart Logic
Estelle Weyl is an internationally published author, speaker, trainer, and consultant. Estelle started her professional life running public health programs, but decided instead to be a web standardista. A UI Engineer, she has consulted for Kodakgallery, Samsung, SurveyMonkey, Y... Read More →


Tuesday October 10, 2017 10:00am - 11:00am
Queen Anne Ballroom Hotel Monteleone

10:00am

Responsive Web Applications with Container Queries #rwdqueries

How do you take a complex web application, with a myriad of components and interactions, and make it fully responsive without pulling your hair out for a year?

With a focus on Container Queries, we’ll look at the approach the Shopify Admin team used, from design to development, to manage the intricate interactions between all the application’s components, pulling off a fully fluid responsive design in under a month.

We’ll also look at how this approach is currently being used at Xero to achieve unity between disparate tech stacks and to speed up the development process.


Speakers
avatar for Jonathan Snook

Jonathan Snook

Shopify
I'm a web designer and developer who is currently a product manager at Shopify. | Before Shopify, I worked at Yahoo! as part of the team that redesigned and rebuilt the communication suite of products: Mail, Messenger, Calendar, and more. Before that, I freelanced for almost 5 y... Read More →


Tuesday October 10, 2017 10:00am - 11:00am
Iberville Room Hotel Monteleone

10:00am

What's New in JavaScript? #newjs

As we start to get comfortable with new ES6 features of JavaScript, both the language and the web platform is charging forward with many new features. This talk will cover some of the best things that are brand new to JavaScript as well as things that we can look forward to in the coming months and years. Strap yourself in for a fast-paced talk full of hot tips as we rocket ourselves into the future of JavaScript. 


Speakers
avatar for Wes Bos

Wes Bos

BosType Inc
Wes Bos is an independent full stack developer and designer from Toronto who spends most of his time hacking on HTML5, CSS3, Node.js building applications entirely in JavaScript. Wes is a lead instructor for [Ladies Learning Code](http://ladieslearningcode.com) and [Hacker You](h... Read More →


Tuesday October 10, 2017 10:00am - 11:00am
Orleans Room Hotel Monteleone

10:45am

Morning Break

Yogurt parfaits and pastries help you power through morning sessions.


Tuesday October 10, 2017 10:45am - 11:15am
TBA

11:00am

Animating Vue #animvue

As superfluous as something like animation may initially seem, you can tell a lot about framework by the way that it handles the concept of time. Idiosyncrasies and race conditions in rendering reveal themselves, pauses in DOM and virtual DOM diffing can be exposed.  

This is one of the ways Vue shows itself to be uniquely capable and elegant as a framework. In this session, we'll cover how to use the <transition> component and some of its offerings to create fluid effects in the browser. We'll move on to watchers and transitioning state. Finally, we'll talk about lifecycle methods, asynchronous updates, and pushing our animations to the next level.


Speakers
avatar for Sarah Drasner

Sarah Drasner

Senior Developer Advocate, Microsoft
Sarah Drasner is an award-winning Speaker, Senior Developer Advocate at Microsoft, and Staff Writer at CSS-Tricks. Sarah is also the co-founder of Web Animation Workshops, with Val Head. She’s the author of SVG Animations from O’Reilly and has given Frontend Masters workshops... Read More →


Tuesday October 10, 2017 11:00am - 12:00pm
Iberville Room Hotel Monteleone

11:00am

Flipping Tables: Displaying Data on Small Screens #flipdata
Speakers
avatar for Stephanie Hobson

Stephanie Hobson

Senior Front-End Developer, Mozilla
Stephanie has been coding since 1998 for websites big and small. HTML, CSS, and JavaScript have always been her passion so her interests naturally extend to web standards, progressive enhancement, performance, analytics, and accessibility. She’s currently working as front-end d... Read More →


Tuesday October 10, 2017 11:00am - 12:00pm
Queen Anne Ballroom Hotel Monteleone

11:00am

The Ins and Outs of Easing #easinout
You probably use easing all the time in your work, but how well do you know your favorite easing functions? In this session we’ll dig into the math behind cubic-beziers, the Penner easing equations, and springs; looking at what each is best for, and how each makes easing happen. We’ll even do a little DIY easing and pseudo-physics for fun. Join Val for this math-tastic and cat-tastic deep dive into all things easing functions to become an easing expert! 

Speakers

Tuesday October 10, 2017 11:00am - 12:00pm
Orleans Room Hotel Monteleone

12:00pm

Wrap-Up Panel
Our annual tradition —all CSS Dev Conf speakers together on stage for an hour to answer your last minute questions! 

Tuesday October 10, 2017 12:00pm - 1:00pm
Queen Anne Ballroom Hotel Monteleone

1:00pm

Lunch

Lunch is on your own, so grab some new friends and try that local restaurant your friend told you to try. 

Here are some nearby recommendations:

Hotel Monteleone's Criollo Restaurant
214 Royal StNew Orleans, LA 70130
$$$
American (New), Cajun/Creole, Breakfast & Brunch 
Yelp: ⭐⭐⭐⭐
http://criollonola.com/

 

Johnny’s Po-Boys
511 St. Louis St., New Orleans, LA 70130
A very popular, tiny shop, serving GIANT Po-Boy sandwiches and traditional sides
Yelp: ⭐⭐⭐½
http://www.johnnyspoboy.com


Green Goddess Café
307 Exchange Pl, New Orleans, LA 70130
Vegetarian-GF
$$
Creative New American cuisine & cocktails. Healthy Options. Great dessert.
Yelp: ⭐⭐⭐⭐
http://www.greengoddessvt.com/

 

Café Fleur-De-Lis
307 Chartres St, New Orleans, LA 70130
$$
Casual, narrow café featuring quick, counter-serve breakfast & lunch with ample portions.
Yelp: ⭐⭐⭐⭐
http://www.cafefleurdelis.com/

 

Mena’s Place
200 Chartres St, New Orleans, LA 70130
$$
Longtime place serving Cajun fare like omelets, po’boys & seafood platters for breakfast and lunch.
Yelp: ⭐⭐⭐⭐
http://menaspalace.com/

 

Backspace Bar & Kitchen
139 Chartres St, New Orleans, LA 70130
Veg Options available
$$
Exposed-brick literary-themed spot with a fireplace. Bar food.
Yelp: ⭐⭐⭐⭐
http://www.backspacenola.com/

 

The Jimani
141 Chartres St, New Orleans, LA 70130
Veg options available.
$$
Sport bar with multiple TVs. Pub fare serve late.
Yelp: ⭐⭐⭐½
http://www.thejimani.com/

 

Felipe’s Mexican Taqueria
301 N Peters St, New Orleans, LA 70130
Veg options available
$$
Mexican & Latin food in a casual counter-serve eatery.
Yelp: ⭐⭐⭐⭐
https://www.felipestaqueria.com/

 

Huck Finn’s Café
135 Decatur St, New Orleans, LA 70130
Vegetarian options available.
$$
New Orleans fare – sports pub – lots of TV’s.
Yelp: ⭐⭐⭐½
http://www.huckfinnscafe.com/

 

Creole House Restaurant & Oyster Bar
509 Canal St, New Orleans, LA 70130
$$
Bright, casual restaurant serving classic Cajun-Creole dishes & seafood platters.
Yelp: ⭐⭐⭐⭐
http://creolehouserestaurant.com/

 

Palace Café
605 Canal St, New Orleans, LA 70130
$$ - $$$
Modern Creole cooking in an opulent, high-ceilinged room plus sidewalk seating.
Yelp: ⭐⭐⭐⭐
http://www.palacecafe.com/

 

Welty’s Deli
336 Camp St, New Orleans, LA 70130
Vegetarian options available.
$$
Breakfast & lunch spot serving sandwiches and salads with New Orleans flavor.
Yelp: ⭐⭐⭐⭐½
http://www.weltysdeli.com/

 

Red Gravy
125 Camp St, New Orleans, LA 70130
Vegetarian options available.
$$
Handmade pasta & other traditional Italian staples. 
Yelp: ⭐⭐⭐½
http://redgravycafe.com/

 

Mr. B’s Bistro
201 Royal St, New Orleans, LA 70130
$$
Modern, seasonal Louisiana fare in a refined, wood paneled space.
Yelp: ⭐⭐⭐⭐
http://www.mrbsbistro.com/

 

Acme Oyster House
724 Iberville St, New Orleans, LA 70130
$-$$
Lively New Orleans based chain offering oyster, po’boys, gumbo & other Cajun-Creole classic.
Yelp: ⭐⭐⭐⭐
http://www.acmeoyster.com/

 

Red Fish Grill
115 Bourbon St, New Orleans, LA 70130
$$-$$$
Seafood & Cajun favorites including oysters in a funky & lively space.
Yelp: ⭐⭐⭐⭐
http://www.redfishgrill.com/

 

Felix’s Restaurant & Oyster Bar
739 Iberville St, New Orleans, LA 70130
$$
Local seafood platters, fresh-shucked oysters & Creole staples in a casual barroom setting.
Yelp: ⭐⭐⭐⭐
http://www.felixs.com/

 

The Ruby Slipper Café
1005 Canal St, New Orleans, LA 70112
Vegetarian options available.
$$
Cheery café serving signature omelets, Southern brunch fare & cocktails in a relaxed atmosphere.
Yelp: ⭐⭐⭐⭐
https://www.therubyslippercafe.net/

 

Café Beignet
311 Bourbon St, New Orleans, LA 70130
Vegetarian options available.
$-$$
Charming, counter-serve café with menu of beignets, Cajun & breakfast fare, plus patio seating.
Yelp: ⭐⭐⭐½
http://www.cafebeignet.com/

 

GW Fins
808 Bienville St New Orleans, LA 70112
Vegetarian and Gluten Free options available.
$$
Creative, ever-shifting seafood menu featuring fresh catches in a stylish updated warehouse space.
Yelp: ⭐⭐⭐⭐½
http://gwfins.com/


Starbucks
500 Canal St, New Orleans, LA 70130
Yelp: ⭐⭐⭐½

 


Tuesday October 10, 2017 1:00pm - 3:00pm
TBA

3:00pm

Best of: Don't Use My Grid System (Or Any Others) #gridsys
Speakers
avatar for Miriam Suzanne

Miriam Suzanne

Founder, OddBird
Miriam Suzanne is an author, performer, musician, designer, and web developer — working with OddBird, Teacup Gorilla, CSS Tricks, and anyone who loves open-source collaboration. She’s the author of Riding SideSaddle* and The Post-Obsolete Book, co-author of Jump Start Sass an... Read More →


Tuesday October 10, 2017 3:00pm - 4:00pm
Queen Anne Ballroom Hotel Monteleone

3:00pm

Best of: Introducing a Design System to a Legacy Product #legacy
Imagine a product that has been on the market for a number of years without having a designer employed. How can you, as a newly-hired front-end designer, introduce a face-lift and design system without completely interrupting an existing workflow?
  • Explaining the value of a design system to your team
  • Identifying current problems
  • Creating scalable and modular solutions to those problems
  • Getting everyone on board and contributing to the new design system
  • Simultaneously dumping the old and using the new

Tuesday October 10, 2017 3:00pm - 4:00pm
Iberville Room Hotel Monteleone

3:00pm

Best of: Using CSS Grid in the Real World #realgrids
The new CSS Grid specification is here! Sure, it's fun to play with, but is it truly ready or even practical to use for everyday work? As a designer and front-end developer at a software development agency, I've been using CSS Grid in production websites and it is already making my life easier. In this talk, I'll show you some examples that will include:
  • Layouts achieved with a few lines of code that previously required messy hacks or JavaScript - Examples of different syntax and units for CSS Grid 
  • Fallbacks for older browsers 
  • How CSS Grid improves accessibility

Speakers
avatar for Brenda Storer

Brenda Storer

Designer & Front End Developer, thoughtbot
Brenda is a Silicon Valley native who moved to NYC to escape the tech world, only to discover that tech is actually pretty awesome. She is currently a designer and front end developer at thoughtbot, teaches HTML/CSS with Girl Develop It, and specializes in belting out 80's hair m... Read More →


Tuesday October 10, 2017 3:00pm - 4:00pm
Orleans Room Hotel Monteleone

3:00pm

CodePen Show & Tell — Hosted by Chris Coyier
It's time show off. Bring your best demos, tools, and techniques for Show & Tell! 

Hosted by Chris Coyier of CSS-Tricks and CodePen! 

Speakers
avatar for Chris Coyier

Chris Coyier

Web Design Community Curator, CSS-Tricks
Designer at CodePen. Writer at CSS-Tricks.com. Podcaster at Shop Talk Show.



Tuesday October 10, 2017 3:00pm - 4:00pm
La Nouvelle East Hotel Monteleone

3:45pm

Afternoon Break

Chips, mini-sandwiches, and traditional pralines to keep you going. Served at break stations


Tuesday October 10, 2017 3:45pm - 4:15pm
TBA

4:00pm

Best of: Style Guides, Languages, and the Tale of the Million Dollar Button #1Mbutton
How can designers and developers communicate better? Sometimes it feels like we are speaking completely different languages. Our team has tackled this problem head-on and worked hand-in-hand to solve it. We’ve recently taken a second pass at our style guide to evolve it into a Design Language System. This system has broken down language barriers between design, engineering, and product. 

In this talk, I will share how we employed User Research techniques like task analysis and think aloud to pressure test our style guide and refine its development to increase productivity set the stage for one of the most successful AB tests in company history.

Speakers
avatar for Vincent Nalupta

Vincent Nalupta

Senior Software Engineer, Grubhub
Vincent Nalupta has been in love with coding for the visual web since the days of the font tag. He's been tiptoeing the line between design and development ever since. He went on to build front end interfaces for companies like ESPN, J.Crew and Madewell. He now spends his days wr... Read More →


Tuesday October 10, 2017 4:00pm - 5:00pm
Queen Anne Ballroom Hotel Monteleone

4:00pm

Best of: The Transformation of the Transform #transform
While CSS Transforms have been helping us position and animate for years, they are gaining new life as CSS grows. We'll get creative with Transforms and their related properties by taking a look at some of their lesser known aspects, digging into 3D, and exploring how they can be combined in interesting ways with newer tools like CSS Variables. There will be a tiny bit of math... but it's totally the fun kind. 

Key topics: 
  • Using CSS Variables to separate out the transform functions effectively as independent properties 
  • Thinking in three dimensions 
  • Gaining a deeper understanding of 3D perspective 
  • To will-change or not to will-change? 
  • How Transforms are beneficial for animation 
  • What's next in the specification

Speakers
avatar for Dan Wilson

Dan Wilson

Mutual Mobile
Dan is a Front End Developer from Austin, TX. While he loves working in browsers of all sizes, he also spends his time in hybrid mobile apps and the "no screen" world of microcontrollers.


Tuesday October 10, 2017 4:00pm - 5:00pm
Orleans Room Hotel Monteleone

4:00pm

Best of: Variable Fonts #scaletype
Typography is the most important aspect of great design and UX, but can’t come at the expense of performance or we risk our designs never being seen. Variable fonts are coming, and will change everything: with a single font file that can scale in size, width, weight and even x-height—exactly as the type designer envisioned—all controllable via CSS. 
  • What are variable fonts, and when can they be used 
  • Why type is the voice of your words, and how that voice just became a chorus 
  • How to expand the dynamic range of your design with type 
  • Where to be restrained and when to experiment: think character widths on small screens, or even responding to ambient light with stronger character weights

Speakers
JP

Jason Pamental

Isovera
Jason is Senior Director of Design and Technical Strategy at Isovera (isovera.com), where he heads the design and development team, leads workshops, and works with clients establishing their digital strategy. Seasoned design and strategy leader with 20+ years’ experience on the... Read More →


Tuesday October 10, 2017 4:00pm - 5:00pm
Iberville Room Hotel Monteleone

4:00pm

CodePen Show & Tell — Hosted by Chris Coyier
It's time show off. Bring your best demos, tools, and techniques for Show & Tell!

Hosted by Chris Coyier of CSS-Tricks and CodePen! 

Speakers
avatar for Chris Coyier

Chris Coyier

Web Design Community Curator, CSS-Tricks
Designer at CodePen. Writer at CSS-Tricks.com. Podcaster at Shop Talk Show.



Tuesday October 10, 2017 4:00pm - 5:00pm
La Nouvelle East Hotel Monteleone

5:00pm

Closing Keynote Q&A — Dave Rupert
Tuesday October 10, 2017 5:00pm - 6:00pm
Queen Anne Ballroom Hotel Monteleone

6:30pm

Closing Party

Enjoy a cocktail or two, some lovely hors d’oeuvres, and good company before heading out for dinner. Don’t forget to get your tarot cards read!

Join us for the return of Drink & Draw, a creative and occasionally epic drawing game. Get ready to rumble!


Tuesday October 10, 2017 6:30pm - 8:30pm
Iberville/Bienville Hotel Monteleone
 
Wednesday, October 11
 

8:45am

Workshop Check-In

Workshop attendees who also attended Dev Conf can skip registration and just use their conference badge to attend the workshops. Your workshop session appears on the front of your badge.

Workshop attendees who are joining us for the first time on Wednesday should bring a photo ID or registration to check in for the day. Be sure to stick around for breakfast!


Wednesday October 11, 2017 8:45am - 9:45am
La Nouvelle Orleans East & West Rooms Hotel Monteleone

9:00am

Workshop Breakfast

Workshop-day breakfast includes fresh-squeezed fruit and vegetable juices, assorted cereals, yogurt, a selection of pastries, bagels and cream cheese, fresh fruits, scrambled eggs, bacon, sausage, roast potatoes, stone-ground grits, and lots of caffeinated beverages.


Wednesday October 11, 2017 9:00am - 10:00am
La Nouvelle Orleans East & West Rooms Hotel Monteleone

10:00am

Animation Workshop (Full Day)
Limited Capacity filling up

Get up and running with web animation in less time than it would take to read all the tutorials you have bookmarked. In this workshop, you'll get an in-depth look at animating with CSS, JavaScript, and SVG through hands-on exercises while learning how to make your project stand out from the competition with effective animation.

By coding along with Sarah and Val in this workshop, you’ll learn:

  • The essentials of CSS animation
  • Principles of UI/UX for animation
  • Basics of TweenMax and TimelineMax
  • SVG workflow and optimization
  • SVG animation, both with a library and without

Sarah and Val will also show you:

  • How to choose which web animation technologies are best for your projects, with an overview of the animation landscape, explaining which tools to choose and why
  • What CSS transforms, transitions and keyframe animations can do and how to use them effectively in your work
  • Best practices and principles to follow to ensure the animations you create are adding something positive to the user experience, not distracting from it.
  • How to bend SVGs to your will- both regarding optimization and performance, as well as creating dazzling visual effects that bring your project to life.

Wednesday October 11, 2017 10:00am - 5:00pm
Iberville Room Hotel Monteleone

10:00am

Design Systems Workshop (Full Day)
Limited Capacity seats available

Join Micah Godbolt, Senior Design Developer at Microsoft and author of Frontend Architecture for Design Systems, as he shows the Four Pillars of Frontend Architecture and how to deploy scalable and sustainable websites. Attendees will learn about popular tools and techniques as we build a fully featured design system from the ground up.

By coding along with Micah in this workshop, you will learn:

  • How to establish proper coding standards, and how to enforce them.
  • How to create a streamlined and automated process for turning user stories into deployed frontend code.
  • The value of automated testing in all areas of your site, including visual, functional and performance.
  • And the best tools for creating living, powerful and useful documentation that will be the center of communication between every member of your team.

Micah will also show you:

  • How to create consistent methodologies and coding standards for HTML, CSS, and JavaScript.
  • How to make a fully automated process from the editor to the style guide to the production environment.
  • How to develop a full testing suite using a combination of multiple testing approaches.
  • And how to write a fully documented system using various automated and manual documentation systems.


Speakers
avatar for Micah Godbolt

Micah Godbolt

Senior Design Developer, Microsoft
I'm a Front-end Architect, author, speaker, trainer, blogger and developer from the Seattle area.


Wednesday October 11, 2017 10:00am - 5:00pm
Bonnet Carre Room Hotel Monteleone

10:00am

Front-End Design and Dev Workshop (Full Day)
Limited Capacity filling up

It’s an ever-evolving field, they say, and the job of a front-ender these days is broad. It’s not just “I write the HTML and CSS” anymore if it ever was. It’s part designer, part coder, part empath, part interaction designer, and part futurist. Let’s talk about all that by actually building a website. We’ll start from scratch, work through the stages of the process, and end up with a finished website. This will give us an excuse to talk about all the big topics in front-end development and what our jobs really are.

How will this happen? Among other things:

  • We’ll scaffold out a design in HTML, giving us an opportunity to talk about things like HTML5, semantics, and accessibility in their native contexts.
  • We’ll lay out the site in CSS, and in the process talk about things like modern layout techniques (flexbox! grid!), preprocessing, and the role of build tools in the front end process.
  • We’ll use some JavaScript to do things that only JavaScript can do, but we’ll do it in a responsible way that performs well and doesn’t cripple the site if it doesn’t load.
  • At every turn, we’ll consider performance and user experience, making sure we’re building something for human beings, not spec sheets or portfolios.
  • And we’ll think about how to make the offline experience the best it can be because we never know when someone will suddenly lose bandwidth due to network outages, subway tunnels, or holding the phone wrong.

All this in just one day? Yes! By the time we’re done, we’ll have reconsidered not just what we do, but why we do it, and how to do it better moving forward.


Speakers
avatar for Chris Coyier

Chris Coyier

Web Design Community Curator, CSS-Tricks
Designer at CodePen. Writer at CSS-Tricks.com. Podcaster at Shop Talk Show.


Wednesday October 11, 2017 10:00am - 5:00pm
Queen Anne Ballroom Hotel Monteleone

10:00am

React Workshop (Full Day)
Limited Capacity seats available

React is a JavaScript library that has become the tool the choice for easily building dynamic user interfaces. The power is in the Virtual Dom — when your application’s data changes, React figures out which parts of your document need to be changed, and immediately update only those parts.

Hundreds of thousands of developers from small agencies to large companies use React to deliver top notch experiences in their apps and dynamic website components:

  • Facebook.com is made up of thousands of React components.
  • Instagram web viewer is entirely built in React.
  • The brand new Netflix movie browsing experience is powered by React
  • and much more!

You will learn:

  • How to build an entire App or Website Component in React.js from start to finish.
  • Understanding React Components and writing markup with JSX
  • Maintain your Application’s State
  • Communication between components
  • Working with State and HTML5 LocalStorage
  • Real-time web socket data with Firebase
  • Creating maintainable code with JavaScript Modules
  • URL routing with React Router
  • Taking advantage of new ES6 Features

Speakers
avatar for Wes Bos

Wes Bos

BosType Inc
Wes Bos is an independent full stack developer and designer from Toronto who spends most of his time hacking on HTML5, CSS3, Node.js building applications entirely in JavaScript. Wes is a lead instructor for [Ladies Learning Code](http://ladieslearningcode.com) and [Hacker You](h... Read More →


Wednesday October 11, 2017 10:00am - 5:00pm
Orleans Room Hotel Monteleone

1:00pm

Workshop Lunch

Lunch includes plenty of traditional Louisiana favorites: seafood gumbo & rice, potato salad, field greens with plenty of salad additions and dressings, fried catfish, fried chicken, muffalettas, veggie wraps, and Zapp’s chips. Finish it off with a selection of southern pies—apple, cherry, pecan, and lemon. Hmmhmmm!


Wednesday October 11, 2017 1:00pm - 2:00pm
La Nouvelle Orleans East & West Rooms Hotel Monteleone

5:30pm

Post-Workshop Social
Wednesday October 11, 2017 5:30pm - 6:30pm
Hotel Monteleone 214 Royal St. New Orleans, LA 70130