7 Web Component Tricks

Development
My Cease & Desist from AudioEye
On Tuesday April 5, 2022, a FedEx driver dropped off an overnight envelope from Manhattan. It contained a three page Cease & Desist letter from Cozen O’Connor, the law firm representing AudioEye, Inc. On Thursday April 14, 2022, I received a follow-up letter by the same delivery method. I scanned…
p5.glitch
Conjure - Interactive evaluation for Neovim
Interactive evaluation for Neovim
An incoherent rant about design systems
What your design system is and isn’t
Everything you ever wanted to know about building a secure password reset feature
This content is now available in the Pluralsight course "Secure Account Management Fundamentals" Recently I’ve had a couple of opportunities to think again about how a secure password reset function should operate, firstly whilst building this functionality into ASafaWeb and secondly when giving some direction for
Matt Roelle | Fennel: The Practical Lisp
Exciting Times for Browsers (and CSS)
Tips, tricks and tutorials on the web’s most beautiful language.
Idiosyncrasies of the HTML parser
This book will highlight the ins and outs of the HTML parser, and contains almost-impossible quizzes.
Nano JSX • Lightweight 1kB JSX library
Designed to build ultra fast Multi-Page Apps (MPAs), using isomorphic JavaScript. Written in TypeScript. Server Side first with partial hydration. Perfect for your next PWA. As small as svelte.
A Whole Website in a Single JavaScript File
Explanation and making of a website in a single JavaScript file
Cascade
Livecoding with CSS
Project Overview ‹ λ-2D: An Exploration of Drawing as Programming Language, Featuring Ideas from Lambda Calculus – MIT Media Lab
An Exploration of Drawing as Programming Language, Featuring Ideas from Lambda Calculus
Smart Interface Design Patterns — 100 Smart Interface Design Patterns & Live Examples. 6h Video + UX Training.
25 video lessons + 4-weeks UX training. Created for front-end developers, UI engineers and UX/UI designers.
Tweaking In The Browser
A few thoughts on why designing in the browser isn’t designing. It’s more of a tweaking process.
How to Shrink a WSL2 Virtual Disk – Stephen's Thoughts
You can use the diskpart tool to compact a VHDX. This allows you to shrink a WSL2 virtual disk file, reclaiming disk space. I went from 100GB to 15GB.
JavaScript Dev Tools in 2022
A breakdown of the most important JS dev tools in 2022, including their most relevant tradeoffs, and some opinionated advice sprinkled on top.
How We Got Here - The History of Web Development - Richard Campbell
The Internet existed before the Web, but the Web redefined the Internet - what started out as a protocol for helping scientists share documents and references has turned into one of the most important forces in the 21st century. But how did we get here?
Join Richard Campbell as he tells the story of the World Wide Web and the web development tools and techniques that made it all possible. From the early versions of HTML where you laid out web pages with tables (GeoCities anyone?) and simple scripting languages to CSS, JavaScript and HTML 5, leading to Single Page Applications, Progressive Web Apps and Web Assembly! We've come a long way, and the story is continuing!
NDC Conferences
https://ndcsydney.com
https://ndcconferences.com
A Brief History of Frontend Frameworks
Learn the history and evolution of web development frontend frameworks, focussing on JavaScript frameworks.
Talk given by Fabian Buentello at the Houston React Meetup. Thanks to Fabian for giving us permission to post his talk.
🔗Slides: https://speakerdeck.com/initfabian/a-brief-history-of-front-end-frameworks
⭐️References ⭐️
🔗Beginner's Guide to Front End Frameworks by Daniel Tunon - https://www.youtube.com/watch?v=GgRxeuXNLLE
🔗Marco Rogers: Finding Patterns Across Front-end Frameworks [JSConf2014] - https://www.youtube.com/watch?v=Bp3Jy177NvU
🔗A short history of Javascript frameworks: a comparison of JQuery, AngularJS and React - https://vincenttunru.com/A-short-history-of-Javascript-frameworks-a-comparison-of-JQuery-AngularJS-and-React/
🔗Frontend Tech Talk: The Frontend Landscape Explained and 4 Advanced Frameworks - https://www.youtube.com/watch?v=5B15ymmt0oI
🔗JavaScript Timeline 1 - https://image.slidesharecdn.com/frontenddevelopmentforbackenddevelopers-devoxxuk2017-170622135824/95/front-end-development-for-back-end-developers-devoxx-uk-2017-9-1024.jpg?cb=1498139959
🔗JavaScript Timeline 2 - https://pbs.twimg.com/media/CDx_joRXIAAuxZf.png
🔗Douglas Crockford on JavaScript - Chapter 2: And Then There Was JavaScript - https://www.youtube.com/watch?v=RO1Wnu-xKoY
🔗Douglas Crockford: The History of JavaScript - https://www.youtube.com/watch?v=wWi9lPEfNHc
🔗Client-side vs. server-side rendering: why it’s not all black and white - https://medium.freecodecamp.org/what-exactly-is-client-side-rendering-and-hows-it-different-from-server-side-rendering-bd5c786b340d
🔗A Short History of Javascript(W3) - https://en.wikipedia.org/wiki/JavaScript#History
🔗A Short History of Javascript Frameworks - https://vincenttunru.com/A-short-history-of-Javascript-frameworks-a-comparison-of-JQuery-AngularJS-and-React/
🔗Jon Reid - Software Paradigms & Patterns — Did We Get It All Wrong? - https://www.youtube.com/watch?v=Zum1GB3fmt0
🔗Architecture the Lost Years by Robert Martin - https://www.youtube.com/watch?v=WpkDN78P884
🔗React.js Conf 2015 Keynote - Introducing React Native - https://www.youtube.com/watch?v=KVZ-P-ZI6W4
🔗Tom Occhino and Jordan Walke: JS Apps at Facebook(React is born) - https://www.youtube.com/watch?v=GW0rj4sNH2w
🔗Hacker Way: Rethinking Web App Development at Facebook - https://www.youtube.com/watch?v=nYkdrAPrdcw
--
Learn to code for free and get a developer job: https://www.freecodecamp.org
Read hundreds of articles on programming: https://medium.freecodecamp.org
And subscribe for new videos on technology every day: https://youtube.com/subscription_center?add_user=freecodecamp
dotJS 2017 - Tom Dale - Secrets of the DOM Virtual Machine
Filmed at https://2017.dotjs.io on December 1st in Paris. More talks on https://dotconferences.com/talks
Most web applications today build their UIs by running JavaScript. But what happens if we instead treat our templates as a specialized functional programming language that can be compiled into optimized bytecode and executed with a virtual machine? Tom explores this novel architecture and some of the performance benefits it gives us.
Tom Dale: Making the Jump: How Desktop-Era Frameworks Can Thrive on Mobile | JSConf EU 2017
http://2017.jsconf.eu/speakers/tom-dale-making-the-jump-how-desktopera-frameworks-can-thrive-on-mobile.html
Today’s most popular frameworks come from a time when the world was a different place. Ember’s first rendering engine, for example, was optimized around the performance gotchas of Internet Explorer 6. IE6 has since faded into history, and smartphones with spotty connectivity and occasionally dodgy hardware have become the lowest common denominator that we must optimize for.
In this talk, we’ll discuss how smartphones fundamentally change the assumptions we make about architecting applications for the web. Then, we’ll cover how we can embrace these new mobile constraints to build even better apps—for everyone. Finally, we’ll look at the techniques used by desktop-era libraries and what they’re doing to become great for the mobile web.
What I learned reading thousands of resumes for 5+ years
What I learned reading thousands of resumes for 5+ years – Vincent Tang
Before I became a software developer, I used to run my family's restaurant equipment business. One of my tasks was hiring employees to do…
Understanding Layout Algorithms
As front-end developers, we often learn CSS by focusing on individual properties. Instead, we should focus on how the language uses those properties to calculate layouts. In this blog post, we'll pop the hood on CSS and see how the language is structured, and how to learn it effectively.
ReactiveConf 2017 - Tom Dale: Secrets of the Glimmer VM
Main stage talkhttps://reactiveconf.com/25th - 27th October 2017, Bratislava, Slovakia
dotJS 2016 - Evan You - Reactivity in Frontend JavaScript Frameworks
Filmed at http://2016.dotjs.io on December 5th in Paris. More talks on http://thedotpost.com
With today’s modern JavaScript frameworks, we are used to the fact that when the application state changes, the DOM is updated automatically. But how do the frameworks detect state changes, and how do they efficiently propagate the changes through the system? Evan answers these questions based on his experience building Vue.js.
Introducing Spin
Spruce CSS - Minimal, modern CSS framework
Spruce CSS is a modern, minimal CSS Framework built on Sass.
Mdash
Mdash: tiny standards-based design system for all web projects.
How We Built Whimsical | Whimsical
It's all about balance. How we architected our tech stack to be fast, simple, and thoughtfully designed.