Hey there, awesome human! 👋 Welcome to the Linear Table Filter Demo - a super cool project that shows off a filtering system just like the one in Linear!
This project is a fun little demo that recreates Linear's powerful table filtering system. It's like having superpowers for your data tables! ✨ You can filter by:
- 📝 Customer Name (text)
- ✅ Resolution Status (resolved or unresolved)
- 🔢 Issue Numbers (numbers)
- 🚨 Priority Levels (dropdown options)
- 📅 Creation Dates (calendar picking)
This project is built with some really cool tech (but don't worry, we won't get too nerdy):
- ⚡ Next.js - Makes our app super fast and SEO-friendly
- 🎨 Tailwind CSS - For making things pretty without crying
- 🧩 React - Because components are life
- 🔍 Filter Components - Our own custom filtering magic
- Clone this repo (fancy way of saying "download it")
- Run
npm install(gets all the ingredients ready) - Run
npm run dev(fires up the kitchen) - Open your browser and go to
http://localhost:3000(dinner is served!)
- Go to the main page
- See that fancy "Issues" section? Click on the filter button
- Pick what you want to filter by (customer, status, etc.)
- Choose your conditions and values
- Hit "Apply" and watch the magic happen! ✨
- 💅 Clean, minimal UI inspired by Linear
- 🧠 Smart filtering with different data types
- 📱 Works on mobile too (try it!)
- 🌈 Easy to customize for your own projects
Made with love ❤️ and inspired by Linear. No coffee beans were harmed in the making of this demo (but many were consumed ☕).
Found a bug? Want to add a feature? Have a question? Just want to say hi? Open an issue or PR and let's chat!
Remember: in the world of coding, there are no stupid questions... just stupid bugs that hide really well! 🐛