Syntax is a modern frontend web platform that showcases creative digital services and project portfolios.
Built by Tijani Victor Habeeb, a frontend developer passionate about performance, animation, and clean UI architecture.
Developed with Next.js 15, TypeScript, and Supabase integration, this project demonstrates how a frontend engineer can design and deploy a production-ready site with dynamic content and seamless backend connectivity — without relying on heavy full-stack frameworks.
- 🧩 Dynamic Portfolio System – Modular project cards and service pages built with reusable React components.
- 🪄 Animated Interface – Fluid transitions powered by Framer Motion, Lottie, Radix UI, and shadcn/ui.
- 🌗 Light/Dark Theme – Unified theming using Tailwind CSS and MUI.
- 🧠 Supabase Integration – Handles contact form submissions and admin dashboard data with secure APIs.
- 🔐 Secure Dashboard Access – Managed using Supabase Row-Level Security (RLS) for data protection.
- ⚙️ TypeScript Architecture – Fully typed for reliability, scalability, and maintainability.
- ⚡ Optimized Performance – Built for speed, accessibility, and smooth animations across devices.
| Layer | Tools & Frameworks |
|---|---|
| Frontend | Next.js 15, React 19, TypeScript |
| Styling & Animation | Tailwind CSS, Framer Motion, Lottie, MUI, Radix UI, shadcn/ui |
| Backend Integration | Supabase (Auth, Storage, RLS Security) |
| Deployment | Vercel |
Follow the steps below to run Syntax locally:
git clone https://github.com/syntax-services/syntax.git
2️⃣ Navigate into the project directory
cd syntax
3️⃣ Install dependencies
npm install
4️⃣ Configure your environment variables
Create an .env.local file in the root directory and add your Supabase credentials:
NEXT_PUBLIC_SUPABASE_URL=your_supabase_url
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_key
5️⃣ Run the development server
npm run dev
Visit the local development environment at http://localhost:3000.
👤 Author
Name: Tijani Victor Habeeb
Role: Frontend Developer (React, Next.js, Supabase Integration)
Email: habeebtijanivictor@gmail.com
GitHub: https://github.com/syntax-services
Portfolio: https://syntax.com.ng