Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/lourdilene/dataverse-chat

This application displays several personas, each of whom can be interacted with through a chat system powered by the OpenAI API.
https://github.com/lourdilene/dataverse-chat

nodejs openai-api responsive-layout vanilla-js

Last synced: about 1 month ago
JSON representation

This application displays several personas, each of whom can be interacted with through a chat system powered by the OpenAI API.

Awesome Lists containing this project

README 

        
## Creative Community



This project displays several characters, each of whom can be interacted with through a chat system powered by the OpenAI API.



### Installation



Install my-project with npm



```bash

  git clone [email protected]:lourdilene/dataverse-chat.git

  cd my-project

  npm install my-project

  npm run start

```



### Runing Tests



```bash

  npm run test

```



## Project Presentation



### Video Demo (GIF)



![Project Demo](https://github.com/lourdilene/dataverse-chat/blob/main/dataverse-chat.gif?raw=true)



### Features



- Card filtering

- Card sorting

- Individual chat

- Group chat



### 🔗 Links



[![portfolio](https://img.shields.io/badge/my_portfolio-000?style=for-the-badge&logo=ko-fi&logoColor=white)](https://personal-site-weld-six.vercel.app/)

[![linkedin](https://img.shields.io/badge/linkedin-0A66C2?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/lourdilene-souza/)



### 🛠 Skills



Javascript, HTML, CSS, Responsive web pages, SPA, API openAi, Nodejs, Jest, Mock.



### Documentation



- [Node Js](https://nodejs.org/docs/latest/api/)

- [API OpenAi](https://platform.openai.com/docs/api-reference)



### Lessons Learned



In the journey of mastering JavaScript, one of the most pivotal concepts encountered is that of promises. Understanding promises and their role in handling asynchronous operations is essential for writing robust and efficient code. Promises provide a clean and organized way to deal with asynchronous tasks, allowing for better control over the flow of execution.



One valuable lesson learned is the power of Promise.all. This method enables us to execute multiple promises concurrently and wait for all of them to resolve, providing a significant boost in performance for tasks that can be parallelized. By leveraging Promise.all, we can optimize the efficiency of our applications by executing multiple asynchronous operations simultaneously, thereby reducing overall latency and improving user experience.



Another area of exploration is integrating external APIs into our applications, such as the OpenAI API. Utilizing APIs allows us to access a wide range of functionalities and data, enriching the capabilities of our applications. When working with APIs asynchronously, promises play a crucial role in handling asynchronous requests and managing the responses effectively. Leveraging promises ensures that our application remains responsive and resilient even when interacting with external services.



Furthermore, understanding the difference between synchronous and asynchronous functions is paramount. Synchronous functions execute one after the other, blocking the execution flow until each operation completes. In contrast, asynchronous functions allow for non-blocking execution, enabling concurrent operations without halting the entire program. Mastering the art of asynchronous programming empowers developers to create responsive and scalable applications capable of handling complex tasks efficiently.



In the realm of testing, mock texts prove to be invaluable. Mocking allows us to simulate external dependencies and control the behavior of functions during testing, facilitating comprehensive and robust test coverage. By creating mock texts for external API responses or asynchronous operations, we can isolate components for testing, ensuring their functionality in various scenarios without relying on real-world data.



In conclusion, navigating the intricacies of promises, Promise.all, asynchronous programming, API integration, and mock texts equips developers with the skills necessary to build high-performance and resilient JavaScript applications. Embracing these concepts fosters a deeper understanding of asynchronous JavaScript and empowers developers to tackle complex challenges with confidence.



### Reference Content



#### Front-end Development



- [Topics in the Laboratoria website curriculum](https://curriculum.laboratoria.la/pt/web-dev/topics): tests, arrays, objects, functions, DOM in the browser JavaScript.

- [Promises](https://javascript.info/promise-basics)

- [Making requests with Fetch](https://developer.mozilla.org/pt-BR/docs/Web/API/Fetch_API/Using_Fetch)

- [LocalStorage storage](https://javascript.info/localstorage)

- [Creating a SPA router with pure JavaScript](https://github.com/Laboratoria/curriculum/blob/main/guides/router-spa/README.pt.md)

- [Event delegation](https://javascript.info/event-delegation)



#### Artificial Intelligence and Prompting



- [Learn about Prompting](https://learnprompting.org/pt/docs/category/-basic-applications)

- [Prompt Engineering Roadmap](https://roadmap.sh/prompt-engineering)

- [OpenAI Playground](https://beta.openai.com/playground)

- [Making requests](https://platform.openai.com/docs/api-reference/making-requests)

- [Conversing with AI](https://platform.openai.com/docs/api-reference/chat)

- [Priming for Chatbots](https://learnprompting.org/es/docs/basics/priming_prompt)

- [Build your application with AI](https://platform.openai.com/docs/quickstart/build-your-application)

- [OpenAi Postman API](https://www.postman.com/devrel/workspace/openai/documentation/13183464-90abb798-cb85-43cb-ba3a-ae7941e968da)

- [Community OpenAi](https://community.openai.com/)



#### Tools



- [Jest](https://jestjs.io/)

- [Vercel](https://vercel.com/)

- [Netlify](https://www.netlify.com/)