• SEO Optimization
• User authentication with Better-Auth
• Stripe, Polar, Autumn Billing, Dodo Payments, Commet and Creem integration
• Email messaging via Resend, Postmark, Plunk, and Nodemailer
• Modern UI built with Next.js, TailwindCSS, and BaseUI
• Bun as runtime and package manager
• Drizzle ORM and Postgres for database operations
• Internationalization (i18n) with next-intl supporting English, French, and Spanish

For full documentation, visit: [ShipFree Docs](https://shipfree.revoks.dev/docs)

Please read our [Code of Conduct](CODE_OF_CONDUCT.md) before contributing.

For people who want to contribute, please refer to [CONTRIBUTING.md](CONTRIBUTING.md).

ShipFree includes internationalization support using next-intl with automatic locale routing. The template supports English (en), French (fr), and Spanish (es) out of the box.

Navigation Components and Hooks

The i18n/navigation.ts file exports internationalized versions of Next.js navigation components and hooks that automatically handle locale prefixes:

• Link - Internationalized Link component that automatically prefixes routes with the current locale
• redirect - Server-side redirect function that preserves locale
• usePathname - Hook that returns the pathname without the locale prefix
• useRouter - Hook for programmatic navigation with locale support

Usage Examples

#### Using the Link Component

```tsx

import { Link } from '@/i18n/navigation'

// Automatically includes locale prefix (e.g., /en/about, /fr/about)

About

// Switch to a different locale

À propos

```

#### Using Navigation Hooks

```tsx

'use client'

import { useRouter, usePathname } from '@/i18n/navigation'

import { useLocale } from 'next-intl'

export function MyComponent() {

const router = useRouter()

const pathname = usePathname()

const locale = useLocale()

// Navigate to a route (automatically includes locale)

const handleClick = () => {

router.push('/dashboard')

}

// Switch locale for current page

const switchLanguage = (newLocale: string) => {

router.replace(pathname, { locale: newLocale })

}

return (

)

}

```

#### Using Translations

```tsx

// Server Component

import { getTranslations } from 'next-intl/server'

export default async function ServerPage() {

const t = await getTranslations('MyPage')

return

{t('title')}

}

// Client Component

'use client'

import { useTranslations } from 'next-intl'

export default function ClientPage() {

const t = useTranslations('MyPage')

return

{t('title')}

}

```

Adding New Locales

To add a new locale:

1. Add the locale to i18n/routing.ts:

```ts

locales: ['en', 'fr', 'es', 'de'], // Add 'de' for German

```

1. Create a translation file in messages/:

```json

// messages/de.json

{

"PRICING": "Preise"

}

```

1. Update the localeNames object in components/language-switcher.tsx:

```tsx

const localeNames: Record = {

en: 'English',

fr: 'Français',

es: 'Español',

de: 'Deutsch', // Add German

}

```

Route Structure

All routes are automatically prefixed with the locale:

• / or /en → English homepage
• /fr → French homepage
• /es → Spanish homepage
• /en/about → English about page
• /fr/about → French about page