A professional, responsive website template designed for authors, writers, and literary professionals. Built with Next.js, TypeScript, and Tailwind CSS.
- Responsive Design: Mobile-first approach with perfect scaling across all devices
- Modern UI/UX: Glassmorphism effects, smooth animations, and contemporary design patterns
- SEO Optimized: Proper meta tags, semantic HTML, and optimized structure
- Accessibility: WCAG compliant with proper ARIA labels and keyboard navigation
- Performance: Optimized images, lazy loading, and efficient code splitting
- Book Showcase: Featured books section with ratings, reviews, and purchase links
- Author Biography: Comprehensive about section with achievements and timeline
- Reader Testimonials: Social proof with authentic reader reviews
- Blog Integration: News and updates section for author announcements
- Contact System: Professional contact form with multiple inquiry types
- Newsletter Signup: Modern newsletter subscription with trust indicators
- Hot News Bar: Auto-rotating announcements with manual navigation
- Dynamic Navigation: Scroll-responsive header with glassmorphism effects
- Interactive Elements: Hover effects, animations, and micro-interactions
- Form Validation: Client-side validation with proper error handling
- Social Media Integration: Links to all major platforms
- Analytics Ready: Structured for easy Google Analytics integration
- Node.js 18+
- npm or yarn
- Clone the repository
- Install dependencies:
npm install - Run development server:
npm run dev - Open http://localhost:3000
- Author Information: Update
app/page.tsxwith your author details - Books Data: Modify the
featuredBooksarray with your book information - Colors: Customize the color scheme in
tailwind.config.ts - Content: Replace placeholder text and images with your content
- Social Links: Update social media links in the footer component
``` ├── app/ │ ├── page.tsx # Homepage │ ├── books/ # Books catalog │ ├── about/ # Author biography │ ├── blog/ # News and updates │ ├── contact/ # Contact form │ └── layout.tsx # Root layout ├── components/ │ ├── navigation.tsx # Header and navigation │ ├── footer.tsx # Footer component │ └── ui/ # Reusable UI components └── lib/ └── utils.ts # Utility functions ```
Update the following in app/page.tsx:
- Author name and tagline
- Statistics and achievements
- Featured books data
- Testimonials
The template uses a purple/pink gradient theme. To change:
- Update
tailwind.config.tsfor global colors - Modify gradient classes in components
- Update the logo colors in navigation
- Create new page in
app/directory - Add navigation link in
components/navigation.tsx - Update footer links if needed
The template is structured to easily integrate with:
- Contentful
- Strapi
- Sanity
- WordPress (headless)
- Next.js 14: React framework with App Router
- TypeScript: Type-safe development
- Tailwind CSS: Utility-first CSS framework
- shadcn/ui: High-quality UI components
- Lucide React: Beautiful icons
- Framer Motion: Smooth animations (ready to integrate)
- Mobile: 320px - 768px
- Tablet: 768px - 1024px
- Desktop: 1024px+
- Large Desktop: 1440px+
- Image optimization with Next.js Image component
- Lazy loading for non-critical content
- Efficient bundle splitting
- Optimized fonts with next/font
- Minimal JavaScript for core functionality
- Semantic HTML structure
- Open Graph meta tags
- Twitter Card support
- Structured data ready
- Sitemap generation ready
- Robot.txt configuration
Perfect for:
- Fiction authors
- Non-fiction writers
- Poets and literary artists
- Academic authors
- Self-published authors
- Literary agencies
- Publishing houses
This is a portfolio project by Mehedi Pathan. Feel free to fork and customize for your own use.
This project is open source and available under the MIT License.
Mehedi Pathan
- Portfolio: https://www.mehedipathan.com
- LinkedIn: https://www.linkedin.com/in/mehedi-pathan/
- Email: eity.mehedipathan@gmail.com
This template represents modern web development practices and can be easily customized for any author's needs.