Be ITMO VK-MINI-APP

Be ITMO is a VK Mini App for exploring the ITMO culture and supporting students in their interaction with the university. The application includes tasks, information about directions and a virtual assistant of the Leopard, which develops as the tasks are completed.

Developed together with gaminv, raikevichI and EdwardShiroki

Technologies Used

React is a library for creating user interfaces.
VKUI — a set of components for the development of VK Mini Apps.
TypeScript — for typing and improving code stability.
VK Mini Apps Router — navigation control in the app.
VK Bridge — interaction with the VKontakte API to obtain user data.
Django is a backend framework for managing application logic and data.
PostgreSQL is a relational database for storing user data and progress.
Docker — containerization of the application and database for easy deployment.

Features

A virtual character is a Leopard that helps to get acquainted with the directions of ITMO.
Character levels — The Leopard goes through the levels, starting from "Not a dummy" and up to "Gigachad".
Progress of the Leopard — the user's progress is displayed on the progress bar, the icon of the Leopard changes.
Points and rewards — Tasks bring points that can be exchanged for achievements and university merch.
ITMO directions — such as be friendly, be healthy, be eco and others where you can perform unique tasks.

Getting Started

1. Cloning a repository

First clone the repository and go to the project directory:

git clone https://github.com/vovandreevik/VK-MINI-APP.git
cd VK-MINI-APP

2. Configuring the PostgreSQL database in Docker

The project uses PostgreSQL to store data, and the database runs in a Docker container. To run, run the command:

docker-compose up -d

This will create and launch a container with PostgreSQL, which will be available on port 5432. Database Parameters:

User name: myuser

Password: mypassword

Database: mydb

3. Setting up and running the Django backend

Create a virtual environment, activate it and install dependencies for the backend:

python -m venv venv
source venv/bin/activate # For Windows use venv\Scripts\activate
pip install -r requirements.txt

Then perform migrations and start the Django server:

python manage.py migrate
python manage.py runserver

4. Installing and launching VK Mini App

To install and run VK Mini App, refer to documentation.

Pictures

Main Page (light theme)

1.1 Main Page (dark theme)

Be ITMO (light theme)

2.1 Be ITMO (dark theme)

About page

Tasks (light theme)

4.1 Tasks (dark theme)

4.2 The Library task

4.3 The Blood donation task

Shop (lihtk theme)

5.1 Shop (dark theme)

Gigachad