On the air, a new story about the graduation projects of the students of our educational projects. This time we will introduce you to four papers that were presented at the joint defense of the second semester of the Technopark's main program in the disciplines "Front-end development", "Development of web services on Go" and "Interface design". Previous publications: one , two , three .
This is the first time students who have defended projects are exposed to these technologies. The project takes one semester, the purpose of the article is to show the educational process and the results of the students' work.
Virus Music
It is an Internet music service for streaming music without downloading to your device. The main page contains a selection of tracks of the day, as well as a short list of performers.
If you click on an artist, a list of his tracks will open. You can subscribe to your favorite artists so as not to miss their new releases, and you can like your favorite tracks and albums. For the convenience of navigating through the music database, there is a search simultaneously by performers, tracks and albums. Playlists can be created. In the profile, you can see your favorite tracks, liked albums and artist subscriptions, as well as manage your playlists. To make the service look more fun, the guys added the ability to customize the interface colors. And the interface itself is adapted for mobile devices with different screen sizes - the spirit of the times.
While working on projects, the guys had to find compromises when they did not agree on some decisions. In search of a suitable option, we changed two template engines and two post-processors. We also decided to implement MVC in the frontend before we figured out the essence of this approach, because of which later we had to redo a lot. The backend uses a "clean" architecture.
The service is written in Go and JavaScript (with Web Workers to execute JavaScript asynchronously), using the Rest API and the EasyJSON serializer. PostgreSQL and Redis are used to store data, and the gorm library is used to work with them. Microservices communicate with each other via gRPC. The web server is Nginx. Typescript is used. CI / CD is built on top of Github Actions and MCS. Also applied SharingAPI (to share links) and Webpack collector.
To develop the service, you need the most important thing: a decent library of music. The authors also plan to collect statistics about listening in order to create a recommendation system based on user preferences.
Project team: Margarita Boyko, Dmitry Rybakov, Natalia Klimova, Nikita Panev.
Video with project protection .
Kino On
The guys made a website for finding information about films and TV shows . They added the ability to create playlists and leave reviews. The site has thematic selections of films and series, there is a full-text search in the database, with the ability to select genres, years of release, actors.
One of the main functions is to compile a list of similar pictures for a user-defined movie. The guys wanted to create a complete product, so they implemented compilation of collections without fancy machine learning. Instead, for a given movie, those works are selected that site users most often include in one playlist with a given one. That is, the more often two films end up in the same playlist, the more likely they are similar. Although, "similar" is perhaps the wrong term. Rather, they are "films that you will also enjoy with a certain probability." It's the same with TV shows.
Also, students using the Web Share API made the function of sending links to films of interest. Made for beauty, with the ability to attach pictures and descriptions.
The backend is entirely written in Go using the principles of a "clean" architecture. It helped a lot to structure the project. Github actions track every push to the master branch. Tests are run automatically, and if everything is in order, then the project is rolled into Docker containers and sent to Dockerhub. Then they are pulled from the server and launched. The backend is an API server that runs over HTTP and HTTPS. At the first entrance to the site, the client receives a file with the client code. We have automated the launch of the nginx web server using Ansible.
Using the Google Chrome plugin Web Scrapper, the guys collected information about films and TV shows. The data in the form of csv files was processed with a Python script, turned into valid SQL queries, and the database was installed. Nginx SSI is responsible for attaching pictures and descriptions to links to movies and TV shows. HTTP 3.0 is used as the protocol, for this we had to rebuild Nginx with new modules and libraries, write a lot of headers.
Project team: Andrey Zubkov, Konstantin Pronin, Alisa Seledkina, Oleg Elizarov.
Video with project protection .
Drello
This is a multifunctional task manager . The principle applied in Drello is probably familiar to you: the user collects and edits his tasks on a separate board page. On the main screen, the user sees his boards, as well as those to which he was invited. Several templates are provided for quick creation of typical boards.
Tasks are presented in the form of columns, each of which reflects a separate stage of the task.
The task screen contains a description, category tags, checklists, explanatory comments and attached files.
Tasks move between columns by simply dragging and dropping.
There are notifications in real time, with the possibility of turning them off or silent. You can send an invitation link to connect to other users' boards.
The entire backend is written in Go and has a microservice architecture. Microservices communicate with each other in protobuf format via gRPC. The application is covered by monitoring in the form of a bundle of Prometheus and Grafana. The zap library is used for logging. The main data store is PostgreSQL, the file and avatar store is Amazon. Sessions are stored in Memcache. To communicate with the frontend, the Echo router, HTTPS 2.0 protocol and the EasyJSON data serializer are used. The Gorm framework is used to work with the database. The application is also protected from CSRF, XSS, SQL injection attacks. The frontend is written in pure JavaScript, using the MVC pattern and the Fest template engine. We used webpack as a collector, transported it using Babel, distributes static content through Nginx and proxies requests to the backend.
Frontend:https://github.com/frontend-park-mail-ru/2020_1_SIBIRSKAYA_KORONA
Backend: https://github.com/go-park-mail-ru/2020_1_SIBIRSKAYA_KORONA
Project team: Roman Gavrilenko, Alexander Lebedev, Timofey Razumov, Anton Chetverov ...
Video with project protection .
eLoyalty
And the last project in our collection is a loyalty card designer for Apple Wallet. The guys love to go to coffee shops, but they don't like to carry around cardboard cards with stamps, for which they give free coffee. They decided to make a beautiful card in Wallet so that any owner of a small coffee shop could understand its constructor, with the ability to create a design and logic for a loyalty system for a cafe. In addition, electronic cards can remind the client when he is walking near the cafe, notify him about promotions and collect contacts of visitors.
The project is built on a microservice architecture using the GRPC protocol. Passwords are hashed. Docker containers are used, and monitoring and alerts are based on Prometheus and Grafana. The guys also had to independently study the Apple Wallet API - a technology that allows issuing and maintaining electronic cards for Apple Wallet: changing their design, sending notifications, and so on.
Project team: Dmitry Gulyachenkov, Alexander Averkiev, Sergey Petrenko, Dmitry Boldin.
Video with project protection .
In one of the following posts, we will talk about graduation projects in C ++ development. You can read more about our educational projects at this link . And more often go to the Technostream channel , there regularly appear new training videos about programming, development and other disciplines.