https://github.com/codewithalihamza/react-native-chatbot
This is a React Native chatbot application that integrates with OpenAI's API for intelligent conversations. The app is built using Expo and React Native, with TypeScript, and connects to a NestJS backend for handling AI interactions
https://github.com/codewithalihamza/react-native-chatbot
ai app chatbot chatgpt expo gemini integration openai react-native typescript
Last synced: 2 months ago
JSON representation
This is a React Native chatbot application that integrates with OpenAI's API for intelligent conversations. The app is built using Expo and React Native, with TypeScript, and connects to a NestJS backend for handling AI interactions
- Host: GitHub
- URL: https://github.com/codewithalihamza/react-native-chatbot
- Owner: codewithalihamza
- Created: 2025-03-19T16:01:40.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2025-03-22T17:16:38.000Z (about 1 year ago)
- Last Synced: 2025-03-22T18:25:42.823Z (about 1 year ago)
- Topics: ai, app, chatbot, chatgpt, expo, gemini, integration, openai, react-native, typescript
- Language: Kotlin
- Homepage:
- Size: 722 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# React Native APP Chatbot 🤖
Currently it's in-progress.....
This is a React Native chatbot application that integrates with OpenAI's API for intelligent conversations. The app is built using Expo and React Native, with TypeScript, and connects to a NestJS backend for handling AI interactions.
## Features
- Real-time chat interface
- OpenAI API integration
- Secure backend communication
- Modern UI/UX design
- TypeScript support
- Cross-platform (iOS & Android)
## Tech Stack
- Frontend:
- React Native with Expo
- TypeScript
- Nativewind for styling
- Expo Router for navigation
- Prettier & ESLint for code quality
- Backend (NestJS):
- Repository: [NestJS-AI-Assistant](https://github.com/codewithalihamza/NestJS-AI-Assistant)
- OpenAI API integration
- RESTful API endpoints
- Secure API key management
## Getting Started
1. Install dependencies
```bash
yarn install
```
2. Configure Environment Variables
Create a `.env` file in the root directory with:
```
API_BASE_URL=your_backend_url
```
3. Start the app
```bash
npx expo start
```
## Backend Integration
This app connects to a NestJS backend that handles OpenAI API interactions. The backend code is available at [NestJS-AI-Assistant](https://github.com/codewithalihamza/NestJS-AI-Assistant).
Make sure to:
1. Clone and set up the backend repository
2. Configure your OpenAI API key in the backend
3. Update the API_BASE_URL in your frontend environment
## Development
You can start developing by editing the files inside the **app** directory. This project uses [file-based routing](https://docs.expo.dev/router/introduction).
### Available Scripts
- `yarn start`: Start the Expo development server
- `yarn android`: Start the app on Android
- `yarn ios`: Start the app on iOS
- `yarn lint`: Run ESLint
- `yarn format`: Format code with Prettier
## Styling
This project uses [Nativewind](https://www.nativewind.dev/) for styling, providing a Tailwind CSS-like experience in React Native.
## Code Quality
- [Prettier](https://prettier.io/) for code formatting
- [ESLint](https://eslint.org/) for code linting
- [Husky](https://typicode.github.io/husky/#/) for git hooks
## Resources
- [Expo documentation](https://docs.expo.dev/)
- [React Native documentation](https://reactnative.dev/)
- [OpenAI API documentation](https://platform.openai.com/docs)
- [NestJS documentation](https://docs.nestjs.com/)
## 💫 About Me:
I'm Ali Hamza from Pakistan 🇵🇰, an experienced Full Stack Developer. With a comprehensive understanding of both front-end and back-end technologies, I am dedicated to creating strong and reliable software applications that perform well and meet the needs of the users effectively. 💻🚀
## 💻 Tech Stack:
              
## Stay in touch
- Linkedin - [@syedalihamzaofficial](https://www.linkedin.com/in/syedalihamzaofficial/)
- Website - [Ali Hamza](https://syedalihamzaofficial.blogspot.com/)
- Medium - [@syedalihamzaofficial](https://medium.com/@syedalihamzaofficial)
- YouTube - [@TechnicalHamzaOfficial1](https://www.youtube.com/@TechnicalHamzaOfficial1)