YoVDO

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

Offered By: Tejas Kumar via YouTube

Tags

Web Development Courses GraphQL Courses Next.js Courses npm Courses Code Generation Courses Serverless Architectures Courses

Course Description

Overview

Save Big on Coursera Plus. 7,000+ courses at $160 off. Limited Time Only!
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

Related Courses

Build a Full Stack Twitter clone with Next.js
Coursera Project Network via Coursera
Next JS with React Hooks - Building SSR React Applications
Udemy
End to End React with Prisma 2
Udemy
Build a Server Rendered Website with Next.js
Coursera Project Network via Coursera
Next.js 14 & React - The Complete Guide
Udemy