A fast, animated portfolio/agency website built with Next.js, TypeScript and Tailwind CSS to showcase Chacal Studio's projects and creative work.
Quick links
- Website: https://chacalestudio.ar/
- Environment example: .env.example
- Source: https://github.com/juanp-ctrl/Chacal-Studio
Chacal Studio is a production-ready frontend for a creative agency portfolio. It provides:
- A performant, SEO-friendly website built on Next.js (app router)
- Smooth scroll and animation primitives for a polished UX
- Reusable UI primitives using Radix UI, Tailwind and utility components
- Internationalization support via next-intl
- Forms and validation with react-hook-form + zod
- Carousel, charts and other interactive components for portfolio pages
- Production-ready starter for creative/agency sites with accessible UI components
- Focus on performance and animations for strong visual presentation
- Modular structure (app, components, lib) makes it easy to extend
- Integrates common services (email, captcha, analytics) in a developer-friendly way
- Next.js 16 + React 19 + TypeScript
- Tailwind CSS and utility-first styling
- Radix UI primitives for accessible components
- Smooth scrolling and animation libs (lenis, motion)
- Embla carousel for project sliders
- next-intl for i18n support
- Form handling with react-hook-form + zod
- Email + verification integrations (resend, Turnstile) included
- Scripts for linting and formatting (eslint, prettier, husky)
- Node.js (recommended: 18.x or 20.x)
- pnpm (preferred; repository contains pnpm-lock.yaml)
- Git
-
Clone the repo git clone https://github.com/juanp-ctrl/Chacal-Studio.git cd Chacal-Studio
-
Install dependencies pnpm install
-
Environment
- Copy the example env: cp .env.example .env
- Edit
.envand provide the required values (see .env.example for keys)
-
Run development server pnpm dev
- Visit http://localhost:3000
-
Build for production pnpm build pnpm start
Useful npm scripts (from package.json)
- pnpm dev — run development server
- pnpm build — production build
- pnpm start — start built server
- pnpm lint — run ESLint
- pnpm lint:fix — run ESLint and attempt automatic fixes
- pnpm format — format code with Prettier
- pnpm format:check — check formatting
- app/ — Next.js app routes and page layout (app router)
- components/ — shared React components and UI primitives
- public/ — static assets (images, icons)
- i18n/ — translation files
- lib/ — utility functions and service wrappers
- messages/ — localized messages
- next.config.ts, tsconfig.json, postcss.config.mjs — core configs
(See the repository for the full structure)
- Review DEPLOYMENT.md for recommended hosting/deployment steps and environment options
- Check next.config.ts for Next.js configuration and proxy.ts for any proxy rules
- Use .env.example as the source of truth for environment variables
- Open an issue in this repository for bugs or feature requests: Issues
- For quick questions, use the repository Discussions or open an issue (if enabled) or contact the maintainer via their GitHub profile
- Maintained by @juanp-ctrl — see their GitHub profile for contact and other projects
- Before opening PRs:
- Run linting and formatting locally (pnpm lint, pnpm format)
- Provide meaningful commit messages and follow the repository's contribution conventions
- If you run into dependency issues, remove node_modules and the pnpm store and reinstall: rm -rf node_modules && pnpm install
- If environment variables are missing, re-check .env.example and ensure values are present
- For build/runtime errors, check next.config.ts and ensure any service keys (email, captcha) are configured
- .env.example — example environment variables
- DEPLOYMENT.md — deployment instructions
- CONTRIBUTING.md — how to contribute
- package.json — scripts & dependencies
- pnpm-lock.yaml — lockfile for reproducible installs
- next.config.ts — Next.js configuration
- tsconfig.json — TypeScript configuration