diff --git a/README.md b/README.md index 97dd5a3..f8e51bc 100644 --- a/README.md +++ b/README.md @@ -178,6 +178,39 @@ Edit `frontend/App.js`: - Set up CI/CD pipeline - Deploy to production environment +## Development Workflow +### Branch naming conventions + Conventional Commits +We follow the Conventional Commits specification for commit messages. This ensures a consistent commit history and enables automated versioning and changelog generation. + +### Branch Naming Conventions +``` +/ +``` +Examples: +- feature/{feature-name} +- fix/{bug-description} +- docs/{documentation-change} +### Commit Message +Follow this structure for commit messages +``` +(): +``` +Where: +```type``` has one of the following: +- feat: New features +- fix: Bug fixes +- docs: Documentation changes +- style: Code formatting only +- refactor: Code changes without behavior change +- test: Adding or updating tests +- chore: Build process or tooling updates + +### PR process +- Fork or branch from main +- Create a PR with a clear description +- Ensure checks pass (build, lint, test) +- Request review before merging + ## License MIT \ No newline at end of file diff --git a/frontend/README.md b/frontend/README.md index 48dd63f..1a4e707 100644 --- a/frontend/README.md +++ b/frontend/README.md @@ -48,3 +48,6 @@ Join our community of developers creating universal apps. - [Expo on GitHub](https://github.com/expo/expo): View our open source platform and contribute. - [Discord community](https://chat.expo.dev): Chat with Expo users and ask questions. + + +u gotta use WSL \ No newline at end of file diff --git a/frontend/app.json b/frontend/app.json index d8fc92f..7d978da 100644 --- a/frontend/app.json +++ b/frontend/app.json @@ -23,7 +23,8 @@ }, "web": { "output": "static", - "favicon": "./assets/images/favicon.png" + "favicon": "./assets/images/favicon.png", + "bundler": "metro" }, "plugins": [ "expo-router", diff --git a/frontend/app/(tabs)/index.tsx b/frontend/app/(tabs)/index.tsx index 786b736..35d759e 100644 --- a/frontend/app/(tabs)/index.tsx +++ b/frontend/app/(tabs)/index.tsx @@ -1,5 +1,5 @@ import { Image } from 'expo-image'; -import { Platform, StyleSheet } from 'react-native'; +import { Platform, StyleSheet, View, Text } from 'react-native'; import { HelloWave } from '@/components/hello-wave'; import ParallaxScrollView from '@/components/parallax-scroll-view'; @@ -74,6 +74,11 @@ export default function HomeScreen() { app-example. + + + Welcome to Nativewind! + + ); } diff --git a/frontend/app/_layout.tsx b/frontend/app/_layout.tsx index f518c9b..64de491 100644 --- a/frontend/app/_layout.tsx +++ b/frontend/app/_layout.tsx @@ -5,6 +5,8 @@ import 'react-native-reanimated'; import { useColorScheme } from '@/hooks/use-color-scheme'; +import '../global.css'; + export const unstable_settings = { anchor: '(tabs)', }; diff --git a/frontend/babel.config.js b/frontend/babel.config.js new file mode 100644 index 0000000..83360ac --- /dev/null +++ b/frontend/babel.config.js @@ -0,0 +1,9 @@ +module.exports = function (api) { + api.cache(true); + return { + presets: [ + ["babel-preset-expo", { jsxImportSource: "nativewind" }], + "nativewind/babel", + ], + }; +}; \ No newline at end of file diff --git a/frontend/global.css b/frontend/global.css new file mode 100644 index 0000000..81a9a0f --- /dev/null +++ b/frontend/global.css @@ -0,0 +1,12 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; + +@font-face { + font-family: 'Roboto Flex'; + /* Update the url path to point exactly to where your font file lives */ + src: url('./assets/fonts/Roboto-Flex.ttf') format('truetype'); + font-weight: 100 1000; /* Roboto Flex is a variable font, so you can define the weight range */ + font-style: normal; + font-display: swap; +} \ No newline at end of file diff --git a/frontend/metro.config.js b/frontend/metro.config.js new file mode 100644 index 0000000..641aef1 --- /dev/null +++ b/frontend/metro.config.js @@ -0,0 +1,11 @@ +// Learn more https://docs.expo.io/guides/customizing-metro +const { getDefaultConfig } = require('expo/metro-config'); +const { withNativeWind } = require('nativewind/metro'); +const { + wrapWithReanimatedMetroConfig, +} = require('react-native-reanimated/metro-config'); + +/** @type {import('expo/metro-config').MetroConfig} */ +const config = getDefaultConfig(__dirname); + +module.exports = wrapWithReanimatedMetroConfig(withNativeWind(config, { input: './global.css' })); diff --git a/frontend/nativewind-env.d.ts b/frontend/nativewind-env.d.ts new file mode 100644 index 0000000..c0d8380 --- /dev/null +++ b/frontend/nativewind-env.d.ts @@ -0,0 +1,3 @@ +/// + +// NOTE: This file should not be edited and should be committed with your source code. It is generated by NativeWind. \ No newline at end of file diff --git a/frontend/package.json b/frontend/package.json index 1018088..62314bc 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -27,21 +27,24 @@ "expo-symbols": "~1.0.8", "expo-system-ui": "~6.0.9", "expo-web-browser": "~15.0.10", + "nativewind": "^4.2.1", + "prettier-plugin-tailwindcss": "^0.5.14", "react": "19.1.0", "react-dom": "19.1.0", "react-native": "0.81.5", "react-native-gesture-handler": "~2.28.0", - "react-native-worklets": "0.5.1", - "react-native-reanimated": "~4.1.1", - "react-native-safe-area-context": "~5.6.0", + "react-native-reanimated": "^4.1.1", + "react-native-safe-area-context": "^5.4.0", "react-native-screens": "~4.16.0", - "react-native-web": "~0.21.0" + "react-native-web": "~0.21.0", + "react-native-worklets": "0.5.1", + "tailwindcss": "^3.4.19" }, "devDependencies": { "@types/react": "~19.1.0", - "typescript": "~5.9.2", "eslint": "^9.25.0", - "eslint-config-expo": "~10.0.0" + "eslint-config-expo": "~10.0.0", + "typescript": "~5.9.2" }, "private": true } diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js new file mode 100644 index 0000000..e4fb158 --- /dev/null +++ b/frontend/tailwind.config.js @@ -0,0 +1,10 @@ +/** @type {import('tailwindcss').Config} */ +module.exports = { + content: ['./components/**/*.{js,jsx,ts,tsx}', './app/**/*.{js,jsx,ts,tsx}'], + theme: { + extend: {}, + }, + presets: [require('nativewind/preset')], + plugins: [], +}; + diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json index 909e901..2f35dd4 100644 --- a/frontend/tsconfig.json +++ b/frontend/tsconfig.json @@ -12,6 +12,7 @@ "**/*.ts", "**/*.tsx", ".expo/types/**/*.ts", - "expo-env.d.ts" + "expo-env.d.ts", + "nativewind-env.d.ts" ] -} +} \ No newline at end of file