The complete Course to Build on-Device AI Applications

Clone the repository and implement a dynamic crypto search with coin selection, context state management, real-time data fetching, currency switching, and sorting in a responsive UI.

Design a responsive header with a search box, post button, message and notification icons, and a profile picture, plus a toggleable drop-down menu using css and media queries.

Explore a basic pagination flow with page state, total pages, and per-page controls, updating crypto data via context. Implement reset functionality to restore the first page.

Build a dynamic crypto chart component by fetching market data via API, converting Unix timestamps to readable dates, and rendering prices, market caps, and volumes responsively.

Build a data-driven crypto details and trending page user interface, using context providers to render coins, apply active styles, and integrate svg icons for social links.

Build a dynamic form user interface using react-hook-form and sword for schema validation, with modular components for user input and output, grid layout, and a model selector.

Demonstrates building a responsive user interface by tracking window width with a screen size hook, handling resize events, and adjusting navigation layout across breakpoints, including a 480px breakpoint.

Explore differences in icon guidelines through hands-on Next.js UI construction, including a home and about page, hover effects, a light bulb icon, and animated numbers with Framer Motion.

Explain how to use a color context to sync material color and background with useContext and useEffect, and implement a loading screen and responsive scene with fov adjustments.

Tune the scene’s field of view and ambient light, enable orbit controls with zoom disabled, and implement color panels that update the background using RGB colors.

Create and style an about us page and team section with hover effects, color schemes, and global sections, then design a contact page with pattern overlays and gradients.

Explore building an on-device 3d interface using react-three-fiber, gsap animations, and styled components, with custom fonts, svg assets, and global styles to render an interactive loading screen.

Master building a blog layout with seo metadata, og images, and author data, including category, contact, and about pages, plus a responsive dark mode theme switcher using tailwind.

Develop a responsive user interface by adjusting typography, spacing, and borders across pages like about, contact, and categories. Configure next-sitemap and optimize images with Next.js for faster loading.

Explore building a Next.js app with scalable icon components, and render markdown and mdx content using content layer, including configuring next.config.js, defining blog schemas, and frontmatter-driven content.

Develop usable navigation by implementing dynamic routing, responsive layout, and animated social icons with scalable SVG components built in React and framer motion.

Learn to add tracking images and build scroll-driven, interactive UI for on-device AI apps, combining sticky layouts, SVG reveals, parallax images, video, and custom CSS animations.

Learn to build immersive on-device AI interfaces with scroll-driven animations using layout effect, triggers, and scrubbable transitions, delivering synchronized text and design sections like immersive display and fastest processor.

Master parsing json results from the CoinGecko API by fetching crypto data, storing in state, and rendering a formatted crypto table with dynamic prices and market data.

Set up a full-screen 3d hero with react-three-fiber and three.js, render a gltf model with ambient and directional lighting and an environment, and pin the code section with gsap scrolltrigger.

Learn to implement smooth scrolling and parallax effects in a Next.js project using React Lens, GSAP ScrollTrigger, and a lightweight smooth scroll component, including image lists and anchor navigation.

Discover how to build a Wix site from blank canvas, configure color palettes, logos, typography, and media, and create service and project sections with grids, padding, and hover interactions.

Build an interactive pagination system for on-device AI apps, with next/previous controls, multi-step paging, per-page options, and a reset to fetch crypto data from an API.

Master scroll-triggered animations with gsap by updating text and background colors using onstart params, RGBa opacity, and multiple color steps across elements for dynamic visual effects.

Update the user interface by formatting currency values and refining tooltips, and switch the chart between price, market cap, and total volume for 7, 14, and 30 days.

Implement pagination of update records by using saved data from the storage context, wiring get saved data calls, and adding loading indicators and routing for coin details.