Meta tags:
description= The all-new interactive learning experience that teaches you how to build cool stuff with React;
Headings (most frequently used words):
module, react, project, the, with, bonus, joy, of, trusted, by, developers, at, thecurriculum, real, world, inspiredcapstone, projects, it, also, comes, withbonus, features, level, up, whole, team, let, hear, from, thetest, squad, hi, josh, frequently, asked, questions, links, fundamentals, working, state, hooks, component, api, design, happy, practices, full, stack, 1word, game, 2toast, playground, 3interactive, mdx, based, blog, modulelayout, animations, motion, modulejob, hunting, kit,
Text of the page (most frequently used words):
the (251), react (169), and (153), you (150), this (104), course (91), with (75), for (66), that (54), how (54), can (52), but (36), have (35), learn (35), from (30), #module (29), like (29), use (28), are (28), build (28), your (28), there (27), joy (27), all (26), josh (26), experience (22), who (20), what (20), about (19), been (19), things (19), has (18), also (18), most (17), full (17), more (17), developers (17), get (16), don (16), through (15), not (15), they (15), our (15), really (15), help (15), cover (15), one (14), much (14), know (14), stuff (14), way (14), learning (13), developer (13), courses (13), out (13), content (13), works (13), projects (13), years (13), want (13), interactive (12), javascript (12), feel (12), will (12), need (12), components (12), understand (12), project (12), was (12), new (12), well (11), purchase (11), just (11), using (11), even (11), only (11), building (11), understanding (11), state (11), blog (11), modern (10), some (10), time (10), own (10), after (10), exercises (10), next (10), knowledge (10), why (10), built (10), end (10), work (10), code (9), fun (9), lot (9), community (9), when (9), stack (9), into (9), now (9), real (9), licenses (9), should (9), everything (9), few (8), level (8), skills (8), something (8), here (8), students (8), still (8), license (8), team (8), best (8), said (8), including (8), applications (8), server (8), comfortable (8), videos (7), foundation (7), questions (7), would (7), say (7), before (7), see (7), platform (7), online (7), modules (7), bonus (7), right (7), ultimate (7), over (7), thought (7), several (7), make (7), them (7), design (7), features (7), user (7), focus (7), had (7), front (7), first (7), job (7), its (6), name (6), concepts (6), ton (6), any (6), than (6), hard (6), already (6), email (6), their (6), layout (6), animations (6), package (6), world (6), learned (6), many (6), makes (6), both (6), app (6), resources (6), working (6), css (6), hooks (6), based (6), engineer (6), mini (6), games (6), accessibility (6), practices (6), hook (6), comeau (5), software (5), together (5), web (5), love (5), share (5), dev (5), recommend (5), easy (5), page (5), going (5), else (5), support (5), purchasing (5), these (5), development (5), doing (5), comes (5), buy (5), upgrade (5), between (5), throughout (5), where (5), does (5), coding (5), main (5), discount (5), regional (5), other (5), helped (5), wonderful (5), mental (5), router (5), motion (5), advanced (5), won (5), application (5), early (5), different (5), side (5), deep (5), sure (5), used (5), apps (5), someone (5), component (5), while (4), folks (4), enough (4), free (4), then (4), yep (4), price (4), joshwcomeau (4), com (4), receive (4), address (4), able (4), each (4), offer (4), getting (4), asked (4), feature (4), pay (4), discover (4), video (4), practice (4), find (4), context (4), lots (4), power (4), given (4), typescript (4), confident (4), patterns (4), creating (4), quite (4), tutorials (4), show (4), step (4), game (4), custom (4), yet (4), let (4), text (4), think (4), beyond (4), library (4), test (4), squad (4), beginner (4), aren (4), back (4), taught (4), truly (4), actions (4), which (4), complex (4), his (4), every (4), teaching (4), frontend (4), around (4), exactly (4), dynamic (4), performance (4), contact (3), terms (3), creator (3), khan (3), academy (3), clear (3), write (3), highly (3), important (3), very (3), send (3), spoken (3), structured (3), actually (3), checkout (3), employer (3), made (3), receipt (3), useful (3), discord (3), active (3), uses (3), absolutely (3), yes (3), believe (3), fantastic (3), value (3), unfortunately (3), possible (3), installment (3), following (3), process (3), cost (3), lower (3), written (3), explain (3), experimentation (3), inspired (3), order (3), access (3), must (3), part (3), trade (3), same (3), significantly (3), goal (3), give (3), rock (3), solid (3), once (3), sense (3), try (3), decade (3), suspense (3), streaming (3), finally (3), bit (3), core (3), intuition (3), bunch (3), nothing (3), jsx (3), html (3), instead (3), making (3), two (3), ways (3), fill (3), heard (3), challenge (3), solve (3), starting (3), assume (3), etc (3), depth (3), knew (3), started (3), fundamentals (3), rendering (3), struggled (3), journey (3), latest (3), friendly (3), thinking (3), start (3), version (3), professional (3), 2019 (3), curriculum (3), teach (3), talk (3), popular (3), magic (3), model (3), though (3), under (3), hood (3), explanations (3), down (3), day (3), ground (3), tried (3), incredible (3), along (3), create (3), created (3), usability (3), api (3), tutorial (3), toggle (3), light (3), visual (3), effect (3), 2020 (2), present (2), joshua (2), rights (2), reserved (2), policy (2), put (2), illustrations (2), lives (2), detail (2), looking (2), deeper (2), offers (2), types (2), listed (2), 100 (2), significant (2), such (2), skip (2), take (2), complete (2), always (2), assign (2), recipient (2), flow (2), great (2), include (2), completion (2), add (2), save (2), ask (2), general (2), stuck (2), wind (2), jump (2), straight (2), interested (2), isn (2), individually (2), payments (2), future (2), united (2), italy (2), germany (2), available (2), may (2), paypal (2), later (2), select (2), click (2), button (2), installments (2), refund (2), sales (2), reach (2), materials (2), difference (2), originally (2), cannot (2), pro (2), couple (2), lesson (2), mix (2), concept (2), opportunities (2), activities (2), demos (2), hands (2), nope (2), proof (2), anything (2), student (2), enrolled (2), high (2), school (2), university (2), self (2), gain (2), multiple (2), number (2), purchased (2), group (2), bonuses (2), point (2), continue (2), within (2), gone (2), frustrated (2), myself (2), models (2), developed (2), quickly (2), memorize (2), without (2), philosophy (2), sit (2), watch (2), example (2), look (2), boring (2), gaps (2), language (2), good (2), takes (2), array (2), largest (2), expert (2), functions (2), solutions (2), dig (2), useeffect (2), animation (2), surprisingly (2), primarily (2), pretty (2), understood (2), away (2), clarity (2), confidence (2), task (2), date (2), conditional (2), prior (2), zero (2), switching (2), hang (2), gotten (2), bootcamp (2), companies (2), codebases (2), friggin (2), tons (2), 2018 (2), 2016 (2), move (2), since (2), organizations (2), past (2), epiphanies (2), idea (2), 2015 (2), framework (2), consider (2), having (2), expectations (2), everyone (2), thing (2), bring (2), excellent (2), teaches (2), designer (2), examples (2), targeted (2), playgrounds (2), diagrams (2), ever (2), qualcomm (2), precisely (2), deepen (2), covered (2), necessary (2), taking (2), skill (2), complicated (2), totally (2), subject (2), whole (2), polished (2), head (2), incredibly (2), confusing (2), better (2), least (2), never (2), explaining (2), github (2), hundreds (2), includes (2), bundle (2), interview (2), challenges (2), strategies (2), tips (2), hunting (2), secret (2), formerly (2), tools (2), seemingly (2), bleeding (2), edge (2), composable (2), toast (2), exposes (2), structure (2), word (2), explore (2), meta (2), keys (2), happy (2), refining (2), almost (2), optimizing (2), offs (2), scratch (2), starts (2), effects (2), usestate (2), feels (2), frameworks (2), leverage (2), common (2), covers (2), overwhelming (2), packages (2), taken (2), bluesky, privacy, links, jquery, chief, architect, john, resig, amazing, strikes, impressive, combination, guides, smart, creates, stop, shop, recommended, advocate, google, una, kravets, cutting, wait, shopify, remix, maintainer, chance, caliber, strong, knocked, park, again, material, organized, follow, learners, message, question, told, spent, anywhere, hours, investment, faster, long, alternatively, regular, easiest, intended, corporate, orders, gifts, single, gift, somebody, requires, invoice, quote, shoot, accommodate, request, link, edited, information, reimbursement, company, vat, info, customized, prove, linkedin, profile, twitter, accomplishment, anyone, completes, showing, completed, certificates, verified, unique, url, pdf, certificate, spending, answering, thrilled, channel, specifically, moderated, according, conduct, vibrant, place, thousands, members, genuinely, tiers, options, people, carte, hope, worldwide, states, kingdom, spain, france, australia, countries, longer, periods, during, four, interest, supporting, tax, feelings, return, days, paid, current, discounts, applied, upgrades, basic, tier, 200, bite, sized, format, leading, experiments, apply, broader, realistic, dirty, assignments, mostly, lifetime, updates, improvements, subscription, expire, please, enrollment, card, registration, paperwork, edu, sending, sufficient, qualify, educational, institution, accept, college, bootcamps, restriction, graduated, paced, currently, indeed, combined, coupon, codes, teams, administration, dashboard, distribute, additional, depending, applicable, below, register, moving, higher, living, area, wish, accessing, global, exchange, accessed, home, region, reside, country, india, brazil, pakistan, ethiopia, option, parity, ppp, easier, personally, likely, discouraged, demotivated, hill, climb, steeper, tool, curve, stiff, super, plain, accessible, interfaces, thoughtful, nearly, scalable, architected, ssr, rely, empower, critical, focused, passive, rules, spot, differences, style, distributed, exclusively, puts, heavy, emphasis, interaction, supplementary, es2015, fine, outdated, plenty, develop, foundational, odin, function, numbers, returns, sort, expect, somewhat, familiar, objects, arrays, statements, loops, callbacks, skim, summaries, sprint, meaty, mechanics, thorniest, parts, dependency, reconciliation, telling, compared, soooo, expecting, vanillacoding, vanilla, reasons, got, ultimately, branch, authentication, cms, testing, redux, shallow, introduction, came, small, bedrock, goes, basics, developments, variables, logic, assumed, productive, mobile, angular, vue, trying, grads, rushed, program, suited, newest, release, headline, comprehensively, apis, truthfully, survey, adopted, omission, relevant, major, v19, frequently, instructor, big, life, whether, excited, concordia, continuing, education, department, led, continued, left, organization, million, per, year, beat, saber, gui, manager, map, editor, conferences, check, rally, europe, downloaded, 500, 000, times, month, npm, released, flip, 2014, digitalocean, unsplash, worked, production, oldest, outside, facebook, credentials, puzzle, piece, effectively, avoid, pits, tend, stumble, remember, cool, tasked, investigating, newfangled, outcomes, brand, reviews, santiago, greco, done, exceeded, far, suggest, newbies, literally, constant, assure, qualities, provides, considered, proved, wrong, ghana, nathanael, shine, might, importantly, pieces, ryan, leichty, simply, collection, interspersed, workshops, touch, walk, dan, wilhelm, imparts, minute, handcrafted, quality, indiehacker, founder, bepo, axel, vaindal, exception, discovering, eager, inside, transformed, vision, pavel, fomchenkov, stands, encountered, interim, intern, prakhar, kumar, inc, interviewer, impressed, especially, portfolio, did, land, károly, török, could, collected, crux, pitfalls, ordinary, regret, london, jama, posts, abundance, explanation, regardless, awhile, resource, proper, hari, sharan, bhuju, extremely, satisfied, gained, topics, others, decision, assistant, dave, henson, rarely, found, experts, being, clearly, engaging, heartedly, fullstack, educator, stephen, walter, ability, break, simple, analogies, second, none, improved, completing, coming, reference, come, gatineau, mikaël, sévigny, knack, distilling, ideas, crystal, enjoy, carefully, crafted, wrap, treat, functioned, previous, bigger, picture, were, met, stackblitz, yuka, masuda, beginners, comprehensive, delightful, product, seatgeek, adam, waxman, painful, imagine, foundations, sara, blom, finishing, week, quirky, joyful, perspective, needs, among, webflow, mackenzie, child, doesn, gloss, fundamental, confidently, pleasure, screencasts, varied, devs, provided, feedback, helping, blind, spots, ensure, smooth, hear, codesandbox, ives, van, hoorne, known, staff, research, amelia, wattenberger, keeps, exciting, illustrated, absolute, masterpiece, join, invested, cash, pick, unbeatable, introducing, prompt, requirements, problem, technical, mock, navigate, effective, career, coach, involved, hiring, hobby, kit, weapons, psyched, framer, ecosystem, projection, engine, remarkable, impossible, nifty, today, contrived, toy, except, tech, exact, animated, final, set, didn, static, wanted, bespoke, widgets, reader, mdx, local, featured, straightforward, eye, opening, exercise, customize, generate, toasts, adhere, guidelines, flexible, harder, seems, reusable, low, playground, interesting, decide, tradeoffs, clone, guessing, wordle, reinforced, solidified, challenging, woven, newfound, capstone, initialization, deploy, fit, deliver, experiences, selective, hydration, performant, top, recently, 2023, brought, beta, ushered, era, rebuilt, browser, elements, refs, entirely, advantage, less, scary, immer, distinction, simplify, improve, fell, swoop, owners, parents, little, principle, privilege, favourite, habits, enjoyable, depends, delight, lean, notoriously, tricky, modals, probably, practical, tricks, polymorphism, prop, delegation, compound, slots, achieving, goals, deciding, amount, flexibility, critically, chunk, focusing, shift, hardest, avoiding, stale, values, double, efforts, ticks, immutability, render, gets, fetching, data, network, fetch, third, party, useswr, abstractions, usecallback, usememo, capturing, dom, references, useref, managing, revolutionized, addition, allow, internals, minimal, gradient, generator, sometimes, crucial, role, instances, play, lifting, event, handlers, update, wire, forms, structures, manage, across, allows, alive, differs, templating, element, stateless, person, stumbling, blocks, props, iteration, styling, introduce, director, advocacy, contenda, netlify, cassidy, notebooks, ready, brain, intuitive, certain, emphasize, native, prettier, christopher, vjeux, chedeau, exceptional, decisions, playing, timed, jokes, boss, section, bored, trusted, tell, pure, recipe, uninterrupted, conventions, weapon, extend, care, polish, stepped, dream, empowered, truth, either, succeed, syntax, helpful, robust, problems, dozens, unless, case, maybe, tangible, progress, mouse, running, wheel, dang, todo, list, hell, become, posting, lists, pre, requisite, purple, yellow, turquoise, rich, enroll, login,
Text of the page (random words):
ty we talk a lot about best practices but really there s no such thing as a best practice it depends what you re optimizing for it s all trade offs in this module i ll share my favourite happy practices the design patterns and habits i ve been refining over almost a decade of professional react experience things that just make it enjoyable to work with react here s a few examples of what we ll cover the principle of least privilege and why i give components as little knowledge power as possible the distinction between parents and owners and how we can simplify our code and improve performance in one fell swoop the magic of immer and how it makes complex state much less scary really getting to understand things like react elements refs and keys and how a deep understanding exposes entirely new patterns we can take advantage of module 6 full stack react in this module we go beyond the browser and explore how react works in a full stack context using next js next js is a meta framework built on top of react it s been around since 2016 but was recently totally rebuilt from the ground up in may 2023 next brought its new app router out of beta and ushered in the start of a new era in react in this module we ll learn how to build performant full stack applications using next js 15 and react 19 we cover modern full stack react features including react server components suspense streaming server side rendering w selective hydration next js app router we ll learn how these things work but also how they fit together to deliver incredible next level user experiences this stuff is bleeding edge and this course is one of the first in depth resources to really explore this new world this is the module where everything comes together using everything we learned over the first 5 modules of the course we ll build dynamic full stack react applications from project initialization to deploy real world inspired capstone projects everything you learn in the modules will be reinforced and solidified in 3 challenging projects woven between the modules you ll use your newfound skills to build project 1 word game one of the best ways to learn react is by building games in this first project we build a clone of wordle a popular online word guessing game the main focus of this project is to get comfortable with react state but it also exposes us to some really interesting questions around application structure you ll need to decide how you want state to move through the application and consider different tradeoffs project 2 toast playground we build a reusable low level toast component this is way harder than it seems the component we build will adhere to all accessibility guidelines with a focus on usability and user experience we ll also put a lot of thought into its api design making sure it s composable and flexible we ll also build a mini app to help us customize and generate toasts a few years back i created a react curriculum for a local coding bootcamp and it featured a project like this building a seemingly straightforward ui component students have said that this is a really eye opening exercise project 3 interactive mdx based blog when i created my blog back in 2018 i didn t want to make a boring ol static blog i wanted to create custom bespoke widgets that would help the reader learn a concept by doing in this final project we ll build the ultimate blog you ll learn exactly how to set things up so that you have the full power of react available to you within the content you ll use what you ve learned throughout the course to build dynamic animated demos like this this isn t some contrived toy version of a blog we use the exact same stack i use for my real blog joshwcomeau com except it s even more modern using bleeding edge tech like the next js app router and react server components if i was creating a new blog today this is precisely how i would do it you ll learn all about it in this course you can even use this project as the foundation for your own real world blog it also comes with bonus features if you buy the ultimate package of the course you ll also gain access to some nifty bonuses which will help you in your journey with react bonus module layout animations with motion motion formerly framer motion is one of the most incredible tools in the react ecosystem in this bonus module you ll learn how to use its layout projection engine to do truly remarkable seemingly impossible layout animations it s one of the secret weapons i use to create animations on my blog and i m psyched to show you how i use it bonus module job hunting kit most of us aren t learning react just for fun as a hobby we want to get a job as a react dev this bonus feature includes a ton of strategies and tips to help you navigate the job hunting process i ll share the most effective strategies i ve learned in my time as a career coach and as someone involved in hiring at several companies it features 11 mock interview challenges you ll be given a prompt along with some requirements and asked to solve the problem then i ll show you exactly what i would do if i was given this challenge in a technical interview want to pick up both of my interactive online courses at an unbeatable price introducing the joy for javascript developers bundle it includes both the joy of react and css for javascript developers by purchasing them in this bundle you ll save a bit of cash learn more level up the whole team join hundreds of organizations who have invested in their team s react skills with team licenses receive up to a 20 discount order team licenses this course is an absolute masterpiece josh keeps things exciting by switching between illustrated explanations friendly videos and targeted exercises you ll build a mental model you can use throughout your journey what a wonderful way to learn react amelia wattenberger staff research engineer at github i ve known josh for years and he s built some incredible things with react this course does a fantastic job explaining how react works and how to get the most out of it if there s someone who can make you feel comfortable with react it s josh ives van hoorne creator of codesandbox let s hear from the test squad this course has been developed with the help of 70 developers in the test squad these devs have gone through the content and provided feedback helping me find my blind spots and ensure that the course is a smooth and fun learning experience this has been a varied group from folks who have never tried to work with react to folks who have used it for years here s what they had to say about the joy of react i can confidently say that the joy of react is one of the most polished courses i ve had the pleasure of going through with the mix of text screencasts interactive exercises games and practice projects i feel like everything is finally starting to click for me josh doesn t gloss over stuff like most tutorials but instead makes sure you understand how react works on a fundamental level mackenzie child designer at webflow what i really like about josh s way of teaching is that he takes the time to explain concepts from the ground up the exercises are fun and quirky which makes it joyful to complete the course i also love the accessibility perspective a subject i feel needs a lot more focus among developers after finishing both of josh s courses i use them as a library for knowledge in my day to day work and i look up something at least once a week sara blom frontend developer before the joy of react my experience with react apps was incredibly painful and confusing after going through this course everything makes so much more sense i can t imagine a better way to learn react and modern js foundations adam waxman product design at seatgeek the joy of react course is comprehensive well thought out and delightful to work through this is not only for beginners if you ve used react for a while but are not sure how things work under the hood like me you will learn a lot yuka masuda frontend engineer at stackblitz before taking this course i knew how to build apps with react but not why any of it functioned based on josh s previous work i was confident that the joy of react would help me understand the bigger picture my expectations were met hands down josh has a knack for distilling complex ideas into polished and crystal clear explanations if you enjoy carefully crafted content and want to finally wrap your head around react you re in for a treat mikaël sévigny front end developer from gatineau this course is so much fun josh s ability to break down concepts in a structured and simple way using analogies diagrams mini games and exercises is second to none my understanding of react has significantly improved after completing this course and i know i ll be coming back to it for reference for many years to come stephen walter fullstack developer educator i started this course with zero knowledge of react i now feel not only like i know what i m doing with react but also why i m doing it josh has the wonderful skill so rarely found in experts of being able to clearly explain complicated things to someone totally new to a subject in a fun and engaging way if you are new to react i can whole heartedly recommend this course dave henson assistant front end developer i am extremely satisfied with the knowledge i have gained the course has covered all the necessary topics and the explanations have been excellent taking this course has been the best decision i made and i would highly recommend it to others hari sharan bhuju this course truly lives up to its name i ve used react for awhile now but this is the first resource that has helped me build a proper intuition for what s going on under the hood with react the fantastic interactive resources you see on josh s blog posts are here in abundance i love the way different types of learning resources are used in the course from interactive code playgrounds well written explanation and video resources there s something for everyone regardless of the way you learn mo jama frontend developer from london uk even though i have several years of experience in react i could still deepen my understanding of modern web development josh precisely collected all the crux and pitfalls that an ordinary dev can experience give it a try you won t regret it károly török full stack software developer the joy of react helped me land a job at qualcomm inc the interviewer was impressed by my react knowledge especially custom hooks and my portfolio projects built with react after i did the course prakhar kumar interim software engineer intern at qualcomm this is the most thought through and fun learning experience i ever encountered projects playgrounds interactive diagrams it has it all the joy of react stands by its name pavel fomchenkov ux engineer from germany after re discovering css and learning a new mental model i was really eager to discover josh s new course about react even though i was already confident with my skills it transformed my vision of how react works on the inside i cannot recommend enough following josh s teaching and the joy of react is no exception axel vaindal indiehacker founder at bepo josh s react course imparts both his love of coding and user experience every minute detail is handcrafted including the react based course platform pro quality videos and well targeted exercises and projects this is how online courses should be built dan wilhelm what i love about josh s courses is that i know i m going to walk away having really learned something his courses aren t simply a collection of videos they re interspersed with written content interactive examples illustrations exercises and workshops that really challenge you all with a touch of magic ryan leichty designer and developer josh s courses are the best most courses just teach you how to do stuff but josh teaches you why things work the way they do and more importantly how to bring the pieces together to build an excellent application his knowledge depth and experience shine through this course i highly recommend it even if you have experience building react applications you might learn a thing or two nathanael frontend developer ghana i considered myself an advanced developer when it comes to javascript and react well this course proved me wrong it actually helped me to get things clear things that i already knew this is a constant on every module and i can assure you that it is also one of the main qualities of josh s teaching he provides clarity even for things or concepts that you thought you already understood having done his first css course i had high expectations for this course as well it s exceeded them by far i suggest it not only for newbies but for literally everyone santiago greco full stack developer from italy you can learn even more about the outcomes that developers have had on the brand new reviews page hi i m josh in early 2015 my employer tasked me with investigating this newfangled react framework to see if it was something we should consider using i remember thinking this is friggin cool but i have no idea how this works over the past 11 years i ve been building my understanding of react one puzzle piece at a time i ve had so many epiphanies about how it works how to use it effectively and how to avoid all of the pits that developers tend to stumble into here are some credentials i ve been working as a software engineer since 2014 at organizations like khan academy digitalocean and unsplash i ve worked in lots of production react codebases khan academy is one of the oldest and largest react apps outside of facebook i m the creator of a popular react animation library react flip move the package is downloaded 500 000 times a month from npm it was originally released in 2016 i ve spoken at several javascript react conferences check out my 2018 react europe talk or my 2019 react rally talk i ve built tons of complex react projects on the side including a 3d map editor for beat saber a gui task manager for react applications and the course platform we use in the joy of react i teach front end development skills to over a million developers per year on my blog joshwcomeau com for years i taught web development at concordia university s continuing education department in 2019 i led development on their react curriculum which continued to be used for years after i left the organization react has been a big part of my professional life and i m so friggin excited to help you build confidence with react whether you re just starting out with react or you ve been using it for a while but you still don t quite get it i m here to help josh w comeau instructor the joy of react frequently asked questions is this course up to date for the most part i would say so the course uses the latest major version of react v19 that said we don t cover everything from the newest release the two headline features of react 19 are a...
|
