DEV Community

Cover image for ChatGPT Client with LINE-Style UI Built with Flutter and Riverpod
softjapan
softjapan

Posted on

ChatGPT Client with LINE-Style UI Built with Flutter and Riverpod

ChatGPT Client with LINE-Style UI Built with Flutter and Riverpod

This is a ChatGPT client application developed with Flutter and Riverpod, featuring a LINE-inspired chat UI.

It provides real-time, bidirectional communication by integrating with OpenAI’s GPT models.


Features

  • LINE-Style Chat UI A simple, intuitive design that offers a streamlined user experience
  • Real-Time Chat with OpenAI GPT Model Utilizes the ChatGPT API to enable natural, human-like conversations
  • State Management with Riverpod Improves scalability and maintainability by separating application logic from the UI
  • Responsive Design Adapts seamlessly to various screen sizes, from smartphones to larger devices

Screenshots

Image description


Requirements

  • Flutter 3.19.x or higher
  • Dart 3.3.x or higher
  • OpenAI API Key

Setup

  1. Clone the repository
   git clone https://github.com/softjapan/flutter_chatgpt.git
Enter fullscreen mode Exit fullscreen mode
  1. Install dependencies
   flutter pub get
Enter fullscreen mode Exit fullscreen mode
  1. Configure environment variables Create a .env file in the project’s root directory and add the following:
   endpoint='https://api.openai.com/v1/'
   model='gpt-4-turbo-preview'
   aiToken='your-api-key-here'
Enter fullscreen mode Exit fullscreen mode
  1. Run the application
   flutter run
Enter fullscreen mode Exit fullscreen mode

Technologies Used


License

This project is released under the MIT License. Please see the LICENSE file for details.


How to Contribute

  1. Fork this repository
  2. Create a new feature branch
   git checkout -b feature/amazing-feature
Enter fullscreen mode Exit fullscreen mode
  1. Commit your changes
   git commit -m 'Add some amazing feature'
Enter fullscreen mode Exit fullscreen mode
  1. Push the branch to the remote repository
   git push origin feature/amazing-feature
Enter fullscreen mode Exit fullscreen mode
  1. Create a Pull Request

Author

GitHub Repository: https://github.com/softjapan/flutter_chatgpt

Reinvent your career. Join DEV.

It takes one minute and is worth it for your career.

Get started

Top comments (0)

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

👋 Kindness is contagious

Explore a sea of insights with this enlightening post, highly esteemed within the nurturing DEV Community. Coders of all stripes are invited to participate and contribute to our shared knowledge.

Expressing gratitude with a simple "thank you" can make a big impact. Leave your thanks in the comments!

On DEV, exchanging ideas smooths our way and strengthens our community bonds. Found this useful? A quick note of thanks to the author can mean a lot.

Okay