Loading…
Attending this event?
View analytic

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

Sunday, October 8
 

5:30pm

Check-in & Greet
Start off CSS Dev Conf New Orleans on a high. Hit 'R' in the elevator for the Rooftop Bar. Once there, pick up your badge and a mask for tomorrow's parade. Then grab a drink, drag your colleagues into the photo booth, and have your Tarot Cards read to you on the top of Hotel Monteleone!

Sunday October 8, 2017 5:30pm - 7:30pm
Rooftop Pool & Bar 214 Royal St, New Orleans, LA 70130
 
Monday, October 9
 

8:00am

Breakfast
Monday October 9, 2017 8:00am - 9:00am
TBA

9:00am

Opening Keynote — Mina Markham
Monday October 9, 2017 9:00am - 9:30am
Hotel Monteleone 214 Royal St. New Orleans, LA 70130

10:00am

Introducing a Design System to a Legacy Product
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
TBA

10:00am

Removing Unwanted CSS
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
TBA

10:00am

Web Accessibility: Making Websites Usable for Everyone
Web Accessibility is for everyone – it means making Websites flexible enough to meet a broad range of preferences, needs, and situations. This includes not only individuals with visual, auditory or physical disabilities but anyone with limited Internet connectivity, temporary disabilities (e.g. a broken arm), or changing abilities due to aging.

This session will cover Web Accessibility standards, development, tools, and techniques, including:

  • Specific HTML, CSS and JavaScript techniques for Web Accessibility 
  • WCAG 2.0 AA - these standards will be covered in depth including code samples, compliance checklists and legal implications of non-compliance. 
  • The four main areas of accessibility: Visual, Audio, Physical and Cognitive 
  • The primary tools for testing Web Accessibility: browser plugins, compliance tools, and the NVDA Screen Reader 
  • A survey of resources and certification organizations for ensuring compliance

Speakers
avatar for Will Jayroe

Will Jayroe

Senior Solutions Architect, UI+UX Strategy, Travelport
Will Jayroe is a technologist, futurist and speaker who specializes in Solutions Architecture, Front-End Technology, User Experience, and Visual / Interaction Design. | | Will has worked for companies from the Fortune 500 to San Francisco start-ups, including: AutoTrader.com... Read More →


Monday October 9, 2017 10:00am - 11:00am
Hotel Monteleone 214 Royal St. New Orleans, LA 70130

11:00am

Don't Use My Grid System (Or Any Others)
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
TBA

11:00am

Element-first design with context-aware CSS
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
TBA

11:00am

Slaying Your Webpack Dragon
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
TBA

12:00pm

FLIPping Out About Animated Layouts
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
TBA

12:00pm

Flipping Tables: Displaying Data on Small Screens
Speakers
SH

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 →


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

12:00pm

Variable Fonts
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
TBA

1:00pm

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

3:00pm

Alice in Web Animation API Land

Animation is back in the web development tool chest! We know of declarative CSS Animations and Transitions and fully featured JavaScript animation libraries like GreenSock, but there's a third option rapidly gaining support with major browsers: the Web Animation API! In this talk, Rachel Nabors will take you on a magical journey with Alice from Wonderland to show you how this new API is used to run the CSS Animations in your browser and how you can use it to generate and manipulate animations in your project. Colorful, interactive, useful fun for folks of all disciplines!


Speakers
avatar for Rachel Nabors

Rachel Nabors

Edge Platform Program Manager, Microsoft


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

3:00pm

Deconstructing Images for the Web

Images are an incredible part of the web. Images took the Internet from a scientific paper sharing community to what we know it today, a vibrant global visual medium. As our web pages have matured, their file sizes have grown to--from 702 kb in the 90s to 2.3 MB to today on average. Images make up most of this file size bloat.


Join web builder and author Christopher Schmitt -- author of CSS Cookbook and Designing Web Mobile Graphics, as he explores how to make the most out of images with CSS and SVG. In this session, you’ll review how images are clogging up the mobile web, and what you can do to help fix that: image compression, CSS filters, and SVG.

Speakers
avatar for Christopher Schmitt

Christopher Schmitt

Author, Self
The Internet's Christopher Schmitt.


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

3:00pm

Ride the Lightning (Making Fast Websites)
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
TBA

4:00pm

Light Speed Web with Progressive Web Apps
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 4:00pm - 5:00pm
TBA

4:00pm

Non-traditional Layouts with CSS
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
TBA

4:00pm

The Transformation of the 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
TBA

5:00pm

Building a CSS pipeline using npm
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
TBA

5:00pm

Style Guides, Languages, and the Tale of the Million Dollar Button
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
TBA

5:00pm

Using CSS Grid in the Real World
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
TBA

7:30pm

Opening Party
Monday October 9, 2017 7:30pm - 10:00pm
Hotel Monteleone 214 Royal St. New Orleans, LA 70130
 
Tuesday, October 10
 

8:00am

Breakfast
Tuesday October 10, 2017 8:00am - 9:00am
Hotel Monteleone 214 Royal St. New Orleans, LA 70130

9:00am

Keynote Address — Harry Roberts
Tuesday October 10, 2017 9:00am - 10:00am
TBA

10:00am

Deep Foundational CSS to Solve Common CSS Problems

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
TBA

10:00am

React w/ Wes Bos
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
TBA

10:00am

Responsive Web Applications with Container Queries

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
TBA

11:00am

Animating Vue

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

Web Technology Consultant, SarahDrasnerDesign.com
Sarah is an award-winning Speaker, Consultant, and Staff Writer at CSS-Tricks. She’s formerly Manager of UX Design & Engineering at Trulia (Zillow). She’s given a Frontend Masters workshop on Advanced SVG Animations, and is working for a book for O’Reilly on SVG Animations... Read More →


Tuesday October 10, 2017 11:00am - 12:00pm
TBA

11:00am

Design Systems 2.0: Creating Consistent Interfaces

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.


Tuesday October 10, 2017 11:00am - 12:00pm
TBA

11:00am

The Ins and Outs of Easing
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
TBA

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
TBA

1:00pm

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

3:00pm

Best of CSS Dev Conf 2017 A
Tuesday October 10, 2017 3:00pm - 4:00pm
TBA

3:00pm

Best of CSS Dev Conf 2017 B
Tuesday October 10, 2017 3:00pm - 4:00pm
TBA

3:00pm

Best of CSS Dev Conf 2017 C
Tuesday October 10, 2017 3:00pm - 4:00pm
TBA

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
TBA

4:00pm

Best of CSS Dev Conf 2017 D
Tuesday October 10, 2017 4:00pm - 5:00pm
TBA

4:00pm

Best of CSS Dev Conf 2017 E
Tuesday October 10, 2017 4:00pm - 5:00pm
TBA

4:00pm

Best of CSS Dev Conf 2017 F
Tuesday October 10, 2017 4:00pm - 5:00pm
Session 1

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
TBA

5:00pm

Closing Keynote Q&A — Dave Rupert
Tuesday October 10, 2017 5:00pm - 6:00pm
Hotel Monteleone 214 Royal St. New Orleans, LA 70130
 
Wednesday, October 11
 

9:00am

Workshop Breakfast
Wednesday October 11, 2017 9:00am - 10:00am
Hotel Monteleone 214 Royal St. New Orleans, LA 70130

10:00am

Animation Workshop (Full Day)
Limited Capacity seats available

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
Hotel Monteleone 214 Royal St. New Orleans, LA 70130

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
Hotel Monteleone 214 Royal St. New Orleans, LA 70130

10:00am

Front-End Design and Dev Workshop (Full Day)
Limited Capacity seats available

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
Hotel Monteleone 214 Royal St. New Orleans, LA 70130

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
Hotel Monteleone 214 Royal St. New Orleans, LA 70130

1:00pm

Workshop Lunch
Wednesday October 11, 2017 1:00pm - 2:00pm
Hotel Monteleone 214 Royal St. New Orleans, LA 70130

5:30pm

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


Twitter Feed