Come join us downstairs at the Proof Brewing Company for another excellent evening of inspiration! Rachael Moore, the front-end lead on the new remax.com, has kindly agreed to share the story and take a peek under the hood of this massive (and really nicely done) site. Among the likely topics of discussion are: Object-oriented CSS, CSS preprocessors, JavaScript frameworks, and the ins and outs of working with a distributed team.
Open Web Camp: CSS3 Implementable FeaturesEstelle Weyl
CSS3: You can use CSS3 selectors to target almost any item on the page without adding markup. Rounded corners, tilted images. Drop shadows. CSS3 is the latest and greatest and all the cool kids are doing it. But there is a lot of crazy syntax to memorize and what happens when all browsers are not capable of the effects you are after?
In this session we will learn which CSS3 selectors and design features are supported in modern browsers, and tips and tricks for handling browsers that aren't quite there yet. Welcome to the next generation of web design!
CSS3 For WebKit: iPadDevCamp PresentationEstelle Weyl
Internet Explorer may be holding you back on the desktop, but don't let that stop you from creating kick ass web apps on webkit mobile devices. In this session we'll cover support of CSS3 in webkit. Learn how to use CSS3 to create fabulous looking web apps without the use (or with minimal use) of images.
Open Web Camp: CSS3 Implementable FeaturesEstelle Weyl
CSS3: You can use CSS3 selectors to target almost any item on the page without adding markup. Rounded corners, tilted images. Drop shadows. CSS3 is the latest and greatest and all the cool kids are doing it. But there is a lot of crazy syntax to memorize and what happens when all browsers are not capable of the effects you are after?
In this session we will learn which CSS3 selectors and design features are supported in modern browsers, and tips and tricks for handling browsers that aren't quite there yet. Welcome to the next generation of web design!
CSS3 For WebKit: iPadDevCamp PresentationEstelle Weyl
Internet Explorer may be holding you back on the desktop, but don't let that stop you from creating kick ass web apps on webkit mobile devices. In this session we'll cover support of CSS3 in webkit. Learn how to use CSS3 to create fabulous looking web apps without the use (or with minimal use) of images.
Implementing Awesome: An HTML5/CSS3 WorkshopShoshi Roberts
We go over what parts of HTML5 and CSS3 you can use right away and how to degrade gracefully in order to appease the older browsers. Then, we play with some of the awesome visual candy you can make using the latest properties.
- Presented at PyGotham
Una veloce panoramica sui moduli più “maturi” delle nuove specifiche, con un approccio pratico nell’analisi di soluzioni reali pronte per essere utilizzate da subito sui browser più moderni. Tra gli argomenti trattati: web font, selettori, bordi e background, colori, trasformazioni 2D, media queries.
CSS3 ready to use. Quick introduction to the new specifications.
Web Development for Mobile: GTUG Talk at GoogleEstelle Weyl
You no longer have to wait to use HTML5 and CSS3: in developing for mobile, you don't have to worry about archaic browser. Webkit, the browser engine found on Android and iPhone provide excellent support for CSS3 and HTML5. In this session we learn how we can use these new technologies to create mobile web applications.
HTML5 and CSS3 Refresher
This presentation has been developed in the context of the Mobile Applications Development course, DISIM, University of L'Aquila (Italy), Spring 2013.
http://www.ivanomalavolta.com
Distributing UI Libraries: in a post Web-Component worldRachael L Moore
Modern UI Component libraries influenced by Web Components will rely more heavily on package management than last generation UI Frameworks. In this 15 minute session we'll introduce package management for web graphical user interfaces, talk about the best package contents for a UI component, and some tactics for making smooth releases.
For video, skip to 57 minutes, 13 seconds (57:13), http://www.youtube.com/watch?v=BhP86d5IiM4&t=57m13s
Operations Tooling for UI - DevOps for CSS DevelopersRachael L Moore
Linting, testing, distribution, deployment--and all the associated tooling and tracking.
The learning curve on all this stuff can be pretty harsh for web UI developers. All the vocabulary. All the options. All the extra code. What does it all mean? And what, if anything, does your project need?
In this talk I discuss web user interfaces at scale and the benefits of bringing more of DevOps culture to the UI space, combining introductory material with practical applications.
Talk presented at CSSConf in June 2015.
Creating GUI container components in Angular and Web ComponentsRachael L Moore
So you've embraced architecting your Angular application with reusable components--cheers to you! But you have UI components that need multiple entry points for user markup, and regular ng-transclude left you hanging. In this talk, we'll cover how new web component standards, like the Shadow DOM, handle this. Next, we'll walk through how to accomplish it today in Angular 1.3 -- and also give you a brief glimpse into what a solution will look like in upcoming Angular 2. Afterwards, you'll know how to make layout scaffold components with custom elements that serve as containers for arbitrary user-provided HTML content.
Talk presented at ng-conf in March 2015.
Creating GUI Component APIs in Angular and Web ComponentsRachael L Moore
So you’ve embraced architecting your Angular application with reusable components – cheers to you! But you have UI components that need to communicate with each other or expose public methods, and you’re wondering about your options. In this talk, we’ll cover how new web component standards, like Custom Elements, handle this. Next, we’ll walk through how to accomplish it today in Angular 1.x – and bring it all together into what a solution will look like in upcoming Angular 2. Afterwards, you'll know how to design and implement the public HTML and JavaScript interfaces of GUI components.
Talk presented at Angular Connect in October 2015.
Implementing Awesome: An HTML5/CSS3 WorkshopShoshi Roberts
We go over what parts of HTML5 and CSS3 you can use right away and how to degrade gracefully in order to appease the older browsers. Then, we play with some of the awesome visual candy you can make using the latest properties.
- Presented at PyGotham
Una veloce panoramica sui moduli più “maturi” delle nuove specifiche, con un approccio pratico nell’analisi di soluzioni reali pronte per essere utilizzate da subito sui browser più moderni. Tra gli argomenti trattati: web font, selettori, bordi e background, colori, trasformazioni 2D, media queries.
CSS3 ready to use. Quick introduction to the new specifications.
Web Development for Mobile: GTUG Talk at GoogleEstelle Weyl
You no longer have to wait to use HTML5 and CSS3: in developing for mobile, you don't have to worry about archaic browser. Webkit, the browser engine found on Android and iPhone provide excellent support for CSS3 and HTML5. In this session we learn how we can use these new technologies to create mobile web applications.
HTML5 and CSS3 Refresher
This presentation has been developed in the context of the Mobile Applications Development course, DISIM, University of L'Aquila (Italy), Spring 2013.
http://www.ivanomalavolta.com
Distributing UI Libraries: in a post Web-Component worldRachael L Moore
Modern UI Component libraries influenced by Web Components will rely more heavily on package management than last generation UI Frameworks. In this 15 minute session we'll introduce package management for web graphical user interfaces, talk about the best package contents for a UI component, and some tactics for making smooth releases.
For video, skip to 57 minutes, 13 seconds (57:13), http://www.youtube.com/watch?v=BhP86d5IiM4&t=57m13s
Operations Tooling for UI - DevOps for CSS DevelopersRachael L Moore
Linting, testing, distribution, deployment--and all the associated tooling and tracking.
The learning curve on all this stuff can be pretty harsh for web UI developers. All the vocabulary. All the options. All the extra code. What does it all mean? And what, if anything, does your project need?
In this talk I discuss web user interfaces at scale and the benefits of bringing more of DevOps culture to the UI space, combining introductory material with practical applications.
Talk presented at CSSConf in June 2015.
Creating GUI container components in Angular and Web ComponentsRachael L Moore
So you've embraced architecting your Angular application with reusable components--cheers to you! But you have UI components that need multiple entry points for user markup, and regular ng-transclude left you hanging. In this talk, we'll cover how new web component standards, like the Shadow DOM, handle this. Next, we'll walk through how to accomplish it today in Angular 1.3 -- and also give you a brief glimpse into what a solution will look like in upcoming Angular 2. Afterwards, you'll know how to make layout scaffold components with custom elements that serve as containers for arbitrary user-provided HTML content.
Talk presented at ng-conf in March 2015.
Creating GUI Component APIs in Angular and Web ComponentsRachael L Moore
So you’ve embraced architecting your Angular application with reusable components – cheers to you! But you have UI components that need to communicate with each other or expose public methods, and you’re wondering about your options. In this talk, we’ll cover how new web component standards, like Custom Elements, handle this. Next, we’ll walk through how to accomplish it today in Angular 1.x – and bring it all together into what a solution will look like in upcoming Angular 2. Afterwards, you'll know how to design and implement the public HTML and JavaScript interfaces of GUI components.
Talk presented at Angular Connect in October 2015.
This was a talk given at Django District in March, 2016. It goes over the general gist of how to integrate Django Rest Framework with React and Redux. It also includes a github repo with working code, including using Webpack for Hot Reloading and Redux Dev Tools for time traveling state.
Similar to Refresh Tallahassee: The RE/MAX Front End Story (20)
22. Sass Placeholders
CSS Sass
.error { %error {
color: #d40015; color: $error-color;
} }
Placeholders are like classes,
except they don't get output
until they are used.
32. Skeletons
○ Inline block text next to others:
inline block layout
○ Floating complex blocks next to
others: grid layout
display, float, position, width