Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

YouTube

Building CSS-Tricks and CodePen 2.0 - Insights from Chris Coyier

Tejas Kumar via YouTube

Overview

Google, IBM & Meta Certificates — All 10,000+ Courses at 40% Off
One annual plan covers every course and certificate on Coursera. 40% off for a limited time.
Get Full Access
Dive into an insightful 1 hour 35 minute talk featuring Chris Coyier, CEO of CodePen, as he shares his journey building CSS-Tricks and the ongoing development of CodePen 2.0. Explore the challenges of managing web projects, including advertising and business models. Gain valuable insights into CodePen's tech stack, featuring Next.js and GraphQL, and learn about the benefits of code generation tools for ensuring data consistency and type safety. Discover the future plans for CodePen, including the adoption of server components and NPM support. Delve into discussions on balancing simplicity and complexity in web development, serverless architecture, and staying current with industry trends. Explore CodePen's design system, the use of Tailwind CSS, and potential AI features in CodePen 2.0. Gain a comprehensive understanding of the inner workings and future direction of one of the web's most popular coding platforms.

Syllabus

Introduction and Background
Running CSS-Tricks and CodePen
Workload and Challenges
Moving to Next.js
Server Components and Future Plans
Code Generation with Apollo
Apollo Code Gen and Type Checking
CodePen 2.0 Features
Simplicity vs Complexity
NPM Install and CodePen
NPM Support in CodePen 2.0
ESM vs CommonJS
Common JS and GraphQL
CodePen's Architecture and Transpilation
Serverless Architecture and Lambda Functions
Onboarding and Familiarity with CodePen's Codebase
Staying Up-to-Date with Industry Trends
CodePen's Design System
Using Tailwind CSS in CodePen
CodePen's Data Layer
AI Features and CodePen 2.0
Potential Acquisition of CodePen

Taught by

Tejas Kumar

Reviews

Start your review of Building CSS-Tricks and CodePen 2.0 - Insights from Chris Coyier

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.