Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Create Your Own LLM Chatbot App: A Fun and Easy Guide to React Native Development! #2635

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

MekkCyber
Copy link
Contributor

Adding a blogpost about how to create an on-device chatbot app to chat with small llms using react native and gguf models from the hub :

Create Your Own LLM Chatbot App: A Fun and Easy Guide to React Native Development!

@Vaibhavs10 Vaibhavs10 self-requested a review January 31, 2025 13:32
@SunMarc SunMarc requested review from pcuenca and ngxson February 7, 2025 13:51
Copy link
Member

@ngxson ngxson left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice, this is awesome. Thanks a lot!!

I just do a quick pass, will do another pass later.


- [`llama.rn`](https://github.com/mybigday/llama.rn): a binding for [`llama.cpp`](https://github.com/ggerganov/llama.cpp) tailored for React Native apps.
- `react-native-fs`: allows us to manage the device's file system in a React Native environment.
- `axios`: a library for sending requests to the Hugging Face Hub API.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we use the more modern fetch API? AFAIK it's natively supported by rn

role: 'system',
content:
'This is a conversation between user and assistant, a friendly chatbot.',
},
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
},
},
];

Comment on lines +529 to +531
We store the selected model format in the state and clear the previous list of GGUF files from other selections, and then we fetch the new list of GGUF files for the selected format.
The screen should look like this on your device:
![alt text](assets/blog_images/model_selection_start.png)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You may need to add a new line between each paragraph, otherwise they will be all on the same line.


Let's tackle these one by one in the next sections...

### **Fetching available GGUF models from the Hub**
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
### **Fetching available GGUF models from the Hub**
### Fetching available GGUF models from the Hub

Headers will always be in bold

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants