Wizard app - VK mini app

This is a mini-app for the VK social network where you can find out the age of a name and interesting facts about cats.

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
  • How to install
• My process
  • Built with
  • Useful resources

Overview

The challenge

Users should be able to:

• Open the application in the VK social network
• Choose from two menu items: cat facts and name age
• Receive a cat fact by pressing a button. The cursor in the text field should be placed after the first word
• Enter a name and receive the age of the name by pressing a button or after 3 seconds of finishing typing
• Receive an error message in case of an attempt to duplicate a request

The application should cancel the request if the result of the previous one is no longer needed (in case of slow internet).

Screenshot

Links

• Solution URL: github.com/alexbulgakov/wizard-app

How to install

For local installation, you need to run the following command in the terminal of the project directory:

npm install

To start in development mode, you need to run the command:

npm run dev

My process

Built with

• VK UI - This is a library of adaptive React components for building web applications
• React - JS library
• TypeScript
• Feature Sliced Design - Architectural methodology for frontend projects
• Tan Stack Query - Powerful asynchronous state management
• React Hook Form - Performant, flexible and extensible forms with easy-to-use validation
• YUP - Dead simple Object schema validation
• Cat Facts API
• Age prediction api

Useful resources

• VK mini app creation guide