/bookmarks

My bookmarks

A collection of links to articles, videos, and other resources I find useful.

Frontend

Loading...
Motion-Primitives

new
Motion-Primitives

motion-primitives.comUI kit to make beautiful, animated interfaces, faster. Open-source and customizable.
Tailwind Grid Generator

Tailwind Grid Generator

tailwindgen.comTailwind Grid Generator - a user-friendly tool designed for web developers to effortlessly create customizable Tailwind CSS grids for seamless web development.
GitHub Next | GitHub Spark

GitHub Next | GitHub Spark

githubnext.comGitHub Next Project: Can we enable anyone to create or adapt software for themselves, using AI and a fully-managed runtime?
JSON For You | The best online JSON tool

JSON For You | The best online JSON tool

json4u.comOnline JSON view, format, minify, validate and compare. It also provides graph view to preview JSON data, semantic comparing two JSON diffs, convert JSON to CSV or CSV to JSON and support jq online.
Bento Grid Generator - v0 by Vercel

Bento Grid Generator - v0 by Vercel

bentogrid.v0.buildChat with v0. Generate UI with simple text prompts. Copy, paste, ship.
PureCode AI - Generate UI Using AI

PureCode AI - Generate UI Using AI

purecode.aiGenerate, iterate, and export production-ready UI components, code and designs.
SortableJS

SortableJS

sortablejs.github.ioSortable — is a JavaScript library for reorderable drag-and-drop lists on modern browsers and touch devices. No jQuery required. Supports Meteor, AngularJS, React, Polymer, Vue, Knockout and any CSS library, e.g. Bootstrap.
Magic UI

Magic UI

magicui.designBeautiful UI components and templates to make your landing page look stunning.
Next.js School Management Dashboard UI Design Tutorial

Next.js School Management Dashboard UI Design Tutorial

youtube.comReact Next.js admin dashboard project tutorial for beginners. School management app design with Next.js and Tailwind. Admin, teacher, student, and parent dashboards with responsive tables and animated charts. You are watching the first part of the project (The design part) Watch the second part (Full-stack school management app): (Coming soon) If it is valuable to you, you can support Lama Dev. Join: https://www.youtube.com/channel/UCOxWrX5MIdXIeRNaXC3sqIg/join Buy me a coffee: https://www.buymeacoffee.com/lamadev Source Code: Start here: https://github.com/safak/next-dashboard-ui/tree/starter Completed version: https://github.com/safak/next-dashboard-ui/tree/completed Join Lama Dev groups X / Twitter: https://x.com/lamawebdev Facebook: https://www.facebook.com/groups/lamadev Instagram: https://www.instagram.com/lamawebdev Discord: https://discord.gg/yKremu4mPr 00:00 Introduction 02:38 Installation 05:06 Next.js 15 Pages and Layout Tutorial 11:01 Next.js Tailwind Responsive Layout 18:10 Next.js Tailwind Responsive Menu Design 23:01 Next.js Tailwind Responsive Navbar Design 30:18 Next.js Admin Dashboard Design 39:40 Next.js Animated Chart Tutorial 40:51 Next.js Radial Chart with Re-Charts 52:19 Next.js Animated Bar Chart Example 01:00:11 React Next.js Animated Line Chart Example 01:05:54 React Calendar Tutorial 01:10:36 Events Component Design 01:15:04 Announcement Component Design 01:20:10 Next.js Student Dashboard Design 01:25:56 React Big Calendar (Schedule Calendar) Tutorial 01:43:01 School Management App Parent Dashboard Design 01:43:54 React/Next.js List Table Design with Pagination 01:53:56 React/Next.js Responsive Reusable List Table 02:11:20 School Management App Other List Pages 02:34:08 School Management App Single Teacher Page Design 02:58:15 School Management App Single Student Page Design 03:00:17 Next.js Dynamic Form Buttons (Create, Update, Delete) 03:09:12 React/Next.js Form Modal Design 03:17:11 React Next.js Form Design 03:18:35 React-Hook-Form Tutorial 03:19:35 React-Hook-Form with Zod Validation Tutorial 03:32:25 React/Next.js Form Inputs with Validation 03:47:48 Rendering Forms Conditionally in React 03:50:30 Next.js Lazy Loading Import Tutorial with dynamic() 03:54:22 Outro
react-window-splitter: react-resizable-grid-panels

react-window-splitter: react-resizable-grid-panels

github.comreact-resizable-grid-panels. Contribute to hipstersmoothie/react-window-splitter development by creating an account on GitHub.
High-quality videos on frontend development

High-quality videos on frontend development

buildui.comLearn how to build modern user interfaces for the web.
Gauge

Gauge

gauge.onur.devAn aesthetic and customizable circular visual component for React.
Theme UI Gallery

Theme UI Gallery

theme-ui-gallery.netlify.appCopy and paste-able component structures pre-styled to match your theme
code-hike/codehike: Marvellous code walkthroughs

code-hike/codehike: Marvellous code walkthroughs

github.comMarvellous code walkthroughs.
Tiptap - Dev Toolkit Editor Suite

Tiptap - Dev Toolkit Editor Suite

tiptap.devTiptap is a suite of content editing & real time collaboration tools. Build editor experiences like Notion in weeks, not years.