HNLTech

This website, crafted using Next.js 14 and React.js, is a landing page for legacy dev agencies.

View Live : www.hnltech.in (Domain has expired)

Alternate Deployment : https://hnltech.netlify.app/

Dependencies

Framer Motion: For animations and transitions.
Tailwind CSS: For utility-first CSS styling.
React Three: For rendering 3D scenes.
React Lottie: For Lottie animations.

Install the dependencies

npm i framer-motion clsx tailwind-merge
npm install mini-svg-data-uri
npm install tailwindcss-animate
npm i next-themes
npm install react-icons
npm i three three-globe @react-three/fiber @react-three/drei
npm install react-lottie
npm i —save-dev @types/react-lottie

Getting Started

To get the development server up and running, execute any of the following commands:

npm run dev
# or
yarn dev

Open http://localhost:3000 in your browser to view the application. The page will automatically refresh as you edit app/page.tsx.

The page will auto-update as you modify app/page.tsx.

Project Structure

roooooooot/
├── app/
│   ├── globals.css
│   ├── layout.tsx
│   ├── page.tsx
│   └── provider.tsx
├── components/
│   ├── ui/
│   │   ├── 3d-pin.tsx
│   │   ├── BentoGrid.tsx
│   │   ├── FloatingNav.tsx   
│   │   ├── GradientBg.tsx
│   │   ├── InfiniteMovingCards.tsx
│   │   ├── MagicButton.tsx
│   │   ├── Spotlight.tsx
│   │   └── TextGenerateEffect.tsx
│   ├── Clients.tsx
│   ├── Footer.tsx
│   ├── Grid.tsx
│   ├── Hero.tsx
│   └── OurServices.tsx
├── data/
│   ├── confetti.json
│   ├── globe.json
│   └── index.ts
├── public/
│   └── [assets like images, logos, etc.]
├── utils/
│   └── cn.ts
└── README.md    (You are reading this !)

Learn More

Dive deeper into the technologies used in this project with these resources:

• Next.js Documentation
• React.js Documentation
• Vercel Documentation
• Netlify Documentation
• Framer Documentation
• Aceternity Documentation

---

Have ideas to improve this website?
Drop me a message at ritesh.exe@proton.me