create-ern-boilerplate 0.0.16 → 0.0.18

package/create.js

@@ -78,8 +78,7 @@ async function main() {
         autoInstall = hasInstall; // ✅ install hanya kalau ada flag --install
         console.log(
             chalk.green(
-                `📦 Membuat proyek ${projectName}... (mode cepat${
-                    autoInstall ? " + install dependencies" : ""
+                `📦 Membuat proyek ${projectName}... (mode cepat${autoInstall ? " + install dependencies" : ""
                 })`
             )
         );
@@ -104,6 +103,14 @@ async function main() {
     try {
         await fs.copy(templateDir, targetDir);
 
+        // === Rename .gitignore-template ke .gitignore ===
+        const gitignoreTemplatePath = path.join(targetDir, ".gitignore-template");
+        const gitignorePath = path.join(targetDir, ".gitignore");
+
+        if (await fs.pathExists(gitignoreTemplatePath)) {
+            await fs.move(gitignoreTemplatePath, gitignorePath);
+        }
+
         // === Update package.json ===
         const pkgPath = path.join(targetDir, "package.json");
         if (fs.existsSync(pkgPath)) {
@@ -154,11 +161,10 @@ async function main() {
 ${chalk.green("🎉 Selesai!")}  
 Langkah selanjutnya:
   ${chalk.cyan(`boilerplate ${projectName} berhasil dibuat, silahkan mulai code berdasarkan kebutuhan anda... atau sesuaikan aja`)}
-  ${
-      autoInstall
-          ? chalk.dim("(dependencies sudah terinstall ✅)")
-          : chalk.cyan("")
-  }
+  ${autoInstall
+            ? chalk.dim("(dependencies sudah terinstall ✅)")
+            : chalk.cyan("")
+        }
   ${chalk.cyan("")}
 
 Happy coding! 💻

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-ern-boilerplate",
-  "version": "0.0.16",
+  "version": "0.0.18",
   "description": "Expo React Native boilerplate generator",
   "bin": {
     "create-ern-boilerplate": "./create.js",

package/templates/default/.gitignore-template

@@ -0,0 +1,71 @@
+# OSX
+.DS_Store
+
+# Xcode
+build/
+*.pbxuser
+!default.pbxuser
+*.mode1v3
+!default.mode1v3
+*.mode2v3
+!default.mode2v3
+*.perspectivev3
+!default.perspectivev3
+xcuserdata
+*.xccheckout
+*.moved-aside
+DerivedData
+*.hmap
+*.ipa
+*.xcuserstate
+project.xcworkspace
+
+# Android
+*.iml
+.gradle
+/local.properties
+/.idea/caches
+/.idea/libraries
+/.idea/modules.xml
+/.idea/workspace.xml
+/.idea/navEditor.xml
+/.idea/assetWizardSettings.xml
+.DS_Store
+/build
+/captures
+.externalNativeBuild
+.cxx
+
+# Node
+node_modules/
+npm-debug.log
+yarn-error.log
+
+# Expo
+.expo/
+dist/
+web-build/
+
+# Environment
+.env
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# TypeScript
+*.tsbuildinfo
+
+# Metro
+.metro-health-check*
+
+# Debug
+*.log*
+# @generated expo-cli sync-2b81b286409207a5da26e14c78851eb30d8ccbdb
+# The following patterns were generated by expo-cli
+
+expo-env.d.ts
+# @end expo-cli
+
+# Other
+structure.txt

package/templates/improved/README.md

@@ -0,0 +1,274 @@
+# Expo React Native Boilerplate
+
+A comprehensive boilerplate for building React Native applications with Expo, featuring authentication, theming, and a clean architecture.
+
+## Features
+
+- ✅ **Expo Router** - File-based routing
+- ✅ **TypeScript** - Type-safe development
+- ✅ **NativeWind (Tailwind CSS)** - Utility-first styling
+- ✅ **Authentication Context** - Global auth state management
+- ✅ **Theme Support** - Light/Dark mode with system preference
+- ✅ **Mock API Server** - JSON Server for development
+- ✅ **Secure Storage** - Expo SecureStore for sensitive data
+- ✅ **Path Aliases** - Clean imports with `@` prefix
+- ✅ **Form Validation** - Built-in validation utilities
+- ✅ **Reusable Components** - Button, Input, Card, Loading, etc.
+
+## Project Structure
+
+```
+.
+├── app
+│   ├── (admin)              # Halaman & route khusus admin
+│   ├── (auth)               # Halaman auth (login, register, dsb)
+│   ├── (protected)          # Halaman yang membutuhkan autentikasi
+│   └── _layout.tsx          # Root layout untuk Expo Router
+│
+├── server
+│   ├── db.json              # Mock data untuk JSON Server
+│
+├── src
+│   ├── assets               # Gambar, font, dan aset statis
+│   ├── components           # Komponen UI reusable
+│   ├── contexts             # Context API (Auth, Theme, dsb)
+│   ├── hooks                # Custom React hooks
+│   ├── services             # API service (Axios, interceptors, dll)
+│   ├── theme                # Konfigurasi tema (warna, dark mode)
+│   ├── types                # TypeScript type definitions
+│   └── utils                # Helper functions & constants
+│
+├── app.json                 # Konfigurasi Expo project
+├── babel.config.js          # Konfigurasi Babel
+├── expo-env.d.ts            # Type definitions untuk Expo environment
+├── global.css               # Global style untuk Tailwind / NativeWind
+├── index.ts                 # Entry point utama aplikasi
+├── LICENSE                  # Lisensi project
+├── metro.config.js          # Konfigurasi Metro bundler
+├── nativewind-env.d.ts      # Type support untuk NativeWind
+├── package.json             # Dependency & script project
+├── package-lock.json        # Lock file npm
+├── README.md                # Dokumentasi project
+├── structure.txt            # Struktur folder (auto-generated)
+├── tailwind.config.js       # Konfigurasi TailwindCSS
+└── tsconfig.json            # Konfigurasi TypeScript
+
+```
+
+## Getting Started
+
+### Prerequisites
+
+- Node.js 18+
+- npm or yarn
+- Expo CLI
+
+### Installation
+
+1. Clone the repository:
+```bash
+git clone <your-repo-url>
+cd <your-repo-folder>
+```
+
+2. Install dependencies:
+```bash
+npm install
+```
+
+3. Start the development server:
+```bash
+npm run start
+```
+
+This will start both the Expo development server and the mock API server.
+
+### Available Scripts
+
+- `npm start` - Start Expo development server
+- `npm run android` - Run on Android
+- `npm run ios` - Run on iOS
+- `npm run web` - Run on web
+- `npm run lint` - Run ESLint
+- `npm run type-check` - Run TypeScript type checking
+
+## Configuration
+
+### API Configuration
+
+Edit `src/utils/constants.ts` to configure your API endpoints:
+
+```typescript
+export const API_CONFIG = {
+  BASE_URL: __DEV__ ? 'http://localhost:3001' : 'https://api.yourapp.com',
+  TIMEOUT: 10000,
+};
+```
+
+### Theme Configuration
+
+Customize colors in `src/theme/colors.ts`:
+
+```typescript
+export const colors = {
+  light: {
+    primary: '#3b82f6',
+    // ... other colors
+  },
+  dark: {
+    primary: '#3b82f6',
+    // ... other colors
+  },
+};
+```
+
+## Authentication
+
+The boilerplate includes a complete authentication flow:
+
+### Default Credentials
+
+- **Admin**: developer@localhost.com / @developer
+- **User**: user@localhost.com / @developer
+
+### Using Authentication
+
+```typescript
+import { useAuth } from '@hooks/useAuth';
+
+function MyComponent() {
+  const { user, login, logout, isAuthenticated } = useAuth();
+  
+  // Use authentication methods
+}
+```
+
+## Theming
+
+Switch between light and dark themes:
+
+```typescript
+import { useTheme } from '@hooks/useTheme';
+
+function MyComponent() {
+  const { theme, colors, setThemeMode } = useTheme();
+  
+  // theme: 'light' | 'dark'
+  // colors: current theme colors
+  // setThemeMode: 'light' | 'dark' | 'auto'
+}
+```
+
+## API Services
+
+### Making API Calls
+
+```typescript
+import { newsService } from '@services/newsService';
+
+// Get all news
+const news = await newsService.getNews({ limit: 10 });
+
+// Get single news item
+const newsItem = await newsService.getNewsById('1');
+
+// Create news
+const newNews = await newsService.createNews({
+  title: 'New Article',
+  content: 'Content here',
+  // ...
+});
+```
+
+## Custom Hooks
+
+### useAuth
+
+Access authentication state and methods.
+
+### useTheme
+
+Access theme configuration and toggle themes.
+
+## Components
+
+### Button
+
+```typescript
+<Button
+  title="Click Me"
+  variant="primary"
+  size="md"
+  onPress={() => {}}
+  loading={false}
+  fullWidth
+/>
+```
+
+### Input
+
+```typescript
+<Input
+  label="Email"
+  placeholder="Enter email"
+  value={email}
+  onChangeText={setEmail}
+  error={emailError}
+  secureTextEntry
+/>
+```
+
+### Card
+
+```typescript
+<Card className="mb-4">
+  <Text>Card content</Text>
+</Card>
+```
+
+### Loading
+
+```typescript
+<Loading text="Loading..." fullScreen />
+```
+
+## Path Aliases
+
+Use clean imports with configured path aliases:
+
+```typescript
+import { Button } from '@components/common/Button';
+import { useAuth } from '@hooks/useAuth';
+import { newsService } from '@services/newsService';
+```
+
+## Deployment
+
+### Building for Production
+
+```bash
+# For Android
+eas build --platform android
+
+# For iOS
+eas build --platform ios
+
+# For both
+eas build --platform all
+```
+
+## Contributing
+
+1. Fork the repository
+2. Create your feature branch (`git checkout -b feature/amazing-feature`)
+3. Commit your changes (`git commit -m 'Add some amazing feature'`)
+4. Push to the branch (`git push origin feature/amazing-feature`)
+5. Open a Pull Request
+
+## License
+
+MIT License - feel free to use this boilerplate for your projects!
+
+## Support
+
+For issues and questions, please open an issue on GitHub.