Chat App (React Native + Expo)

A simple mobile chat application built with React Native and Expo. The app includes a start screen where users enter their name and choose a background color, and a chat screen that displays the selected name and background color.

---

Features

• Start screen with:
  • Text input for user name
  • Button to enter the chat
  • Color selection for chat background
• Chat screen with:
  • User name displayed in the navigation header
  • Background color passed from the start screen
• Navigation between screens using React Navigation
• Styled using Flexbox and StyleSheet
• Built and tested using Expo and Android Emulator

---

Tech Stack

• React Native
• Expo
• JavaScript
• React Navigation

---

Project Structure

/components
  ├── Start.js
  └── Chat.js
App.js

---

Setup Instructions

1. Clone the repository:

   git clone <your-repo-url>
   

2. Navigate to the project directory:

   cd chat
   

3. Install dependencies:

   npm install
   

4. Start the Expo development server:

   npx expo start
   

5. Run the app using:

   • Android Emulator, or
   • Expo Go on a physical device

---

Development Notes

• Navigation is implemented using a native stack navigator.
• User name and background color are passed between screens via navigation parameters.

---

Design Specifications

• Vertical and horizontal spacing: evenly distributed
• App title: font size 45, font weight 600, font color #FFFFFF
• "Your name": font size 16, font weight 300, font color #757083, 50% opacity
• "Choose background color": font size 16, font weight 300, font color #757083, 100% opacity
• Color options HEX codes: #090C08, #474056, #8A95A5, #B9C6AE
• Start chatting button: font size 16, font weight 600, font color #FFFFFF, button color #757083