My portfolio website with information about me, contacts, projects
Technologies used: React, TypeScript, HTML, SASS(SCSS), Vite
An e-commerce application. On the front end, has utilized React, Redux, React Router DOM, TypeScript, Tailwind CSS, HTML, and CSS to create a responsive and visually appealing interface. The application offers a wide range of features, including a home page showcasing products with sorting and search capabilities. Users can browse, add items to their cart, and proceed with a simple checkout process. The application also provides product pages, authentication functionality for secure user access, and a profile page for managing account settings.
In the back end, we leveraged Node.js, Express, and Axios to build a robust server-side infrastructure.
Deploy |
Front-end source code |
Back-end source code
Technologies used: TypeScript, HTML, SASS(SCSS), React, Redux, React Router DOM, Tailwind CSS, Node.js, Express, Axios
This project aims to explore and demonstrate the integration of Redux Toolkit Query (RTK Query) with Redux for state management, focusing on TypeScript with MSW (Mock Service Worker) for testing. The main objective is to showcase the effective utilization of RTK Query within a Redux application, covering a significant portion of the provided API functionalities and ensuring comprehensive test coverage.
Technologies used:
React, Redux Toolkit Query, TypeScript, Vitest, MSW (Mock Service Worker), Vite, ESLint, Prettier, Husky
Deploy | Cource code
Professional website made for wonderful professional, life coach Pamela Twigg.
Technologies used: React, Vite, JavaScript, HTML, SASS(SCSS), PHP, Calendly
Professional website made for Mike Snow, a journalist who has lived in three continents, Mike Snow has contributed articles on international politics, travel, finance, agriculture, health and other wide ranging topics to the Washington Post, Philadelphia Inquirer, Los Angeles Times, Toronto Star, Stern Magazine, Miami Herald and dozens of other national and international publications, both as a reporter and combat correspondent in Asia and Africa and, in recent years, a travel writer who has been to more than 100 nations.
Technologies used: HTML, SASS(SCSS), Bootstrap
Professional website made for Shari Tischler - content creator, and blogger
Technologies used: WordPress
This application is a product of the collaboration of three developers: Elena Iakovenko, Tatyana Shipulina, Alexandr Kabanau. A full description of the project is available in README file
The application includes hree.js for 3D Graphics, responsive design, changing light and dark theme, implemented language change (RU/EN/BE), SPA, and routing written by our team on TypeScript, modal dialogs, using Local Storage, our own webpack configuration.
Amazing Trip has
- Country page with:
-Audio API
- playing the national anthem
- reproduction of phrases in the language of the country
- Yandex Maps API
- SpeechRecognition
- user voice recognition to check the pronunciation of phrases in the country language
- Implementation of comments about countries and saving them on the backend
- Ability to manage the gallery using Hotkeys. (Arrow keys, page up/page down, scroll)
- Realization REST API by using Node and Express
- Registration and authorization:
- Registration: validation and creating a new user on the backend
- When trying to authorize an unregistered user, the backend returns an error
- The ability to use the application without registration, but with limited functionality
- Form validation
- User profile
- Possibility to change the user's avatar with saving on the backend (only for registered users)
- For registered users, the progress of exploring countries is displayed
- quiz for each country
- quiz results are displayed in the profile and saved on the backend for each user
- A registered user has access to a quiz on knowledge of information about countries
Deploy | Front-end source code | Back-end source code
Technologies used:
- Front-end: HTML, SCSS, JavaScript, TypeScript, Canvas, Three.js, Audio API, Webpack, Bootstrap, Nouislider;
- Backend: Node.js, Express, Axios
The Momentum project is an analog Momentum application from Google Chrome. The application shows the time and username. The background image and greeting changes depending on the time of day. It also has a clock, images slider, weather widget, audio player, quote of the day widget, to-do list, and settings. The settings allow changing language and hiding some of the widgets.
Deploy | Code
Technologies used: JavaScript, HTML, CSS, Webpack
This project is a dynamic and interactive web SPA application built to showcase a collection of images in a user-friendly gallery format. The ImageGallery project offers the following key features:
- Dynamic Gallery: Users can browse through a collection of images displayed in a dynamic and interactive gallery format.
- Authentication: Users can sign in securely using their Google account to access personalized features.
- Image Upload: Authenticated users have the ability to upload their own images to the gallery, enhancing the collection.
- Responsive Design: The application is designed to be fully responsive, ensuring a seamless experience across devices of all sizes.
Deploy and Source code
Technologies used: React.js, TypeScript, JavaScript, Bootstrap, Firebase
The game Songbird where you should guess a bird by its sound.
Rules are pretty easy:
Each time you guess right from the first try you get 5 points. If the first guess is wrong every next try will cost you 1 point. So if the right try is only 6th you get 0 points.
All points will be added up.
Good luck!
Technologies used: HTML, SCSS, JavaScript, Webpack
Standard Calculator
Technologies used: HTML, SCSS, TypeScript
Game Sudoku
Code | Deploy
Technologies used: HTML, SCSS, JavaScript
Board game Puzzle 15 on JavaScript
Technologies used: HTML, SCSS, JavaScript, Webpack
This project is a Tic Tac Toe game that can be played in the browser. The game allows two players to take turns marking spaces on a 3x3 grid with their respective symbols (X and O). The objective of the game is to get three of your symbols in a row, either horizontally, vertically, or diagonally.
Learning Objectives:
- Practice the module pattern - IIFEs JavaScript by organizing code into objects and factories.
- Implement game logic for checking win conditions and handling player turns.
- Manipulate the DOM to update the game interface dynamically.
Technologies used: HTML, SCSS, JavaScript
The card algorithm in the Eldritch Horror board game involves arranging and shuffling three types of mixing cards: blue, brown, and green, each denoted by distinct color indicators on the card header. These card types are associated with different characteristics:
- Complex Cards: These cards, represented by a blue map icon, exhibit intricate designs and tentacles surrounding their names.
- Ordinary Cards: These cards do not bear any specific visual markers and are devoid of additional signs.
- Light Cards: Marked by an image of snowflakes around their names, these green cards symbolize events occurring at sunrise. The initial step entails selecting an Ancient One, which determines the deck composition and the quantity of cards of each color needed throughout the game. Subsequently, the card mixing process adheres to the instructions provided on each Ancient One card.
The game progresses through five distinct levels, during which the composition and arrangement of the card decks may change based on the specific instructions and rules of the chosen Ancient One.
Technologies used: HTML, SCSS, JavaScript
A small pet project includes Home (2 sliders) and Donate pages (Pick and feed a friend interactive form). The site has an adaptive design.
Code | Deploy
Stack: HTML, SCSS, JavaScript, Webpack
Landing page
Technologies used: HTML, SCSS, JavaScript