Mariusz Szlachta

About me

My name is Mariusz. I'm an ambitious web developer for whom programming is a passion. I started my adventure with programming in 2017 and I continuously develop my skills.

After a few months of self-teaching, I decided on a bootcamp Web Developer organized by Kodilla, during which I built a solid foundation in the area of web apps development based on the most popular JavaScript technologies and I graduated with extraordinary results.

Next, I got some first experience with commercial projects by creating some websites ad other mini-projects. I also cooperated with the Akanza company from Lublin with their projects.

The first serious commercial experience I acquired working as a Junior JavaScript developer in Asseco Business Solutions. That job spread my horizons, taught best practices, design patterns, and made me a conscious programmer. Working there I was responsible for two projects.

Connector portal - I was responsible to create new functionalities like powerful data grids to present thousand of records and rewrite old functionalities in a modern way using React, Kendo UI, JSP, Redux, and many more
Direct Portal - a startup-like project made from scratch in React as Single Page Application. I was able to introduce solutions in the area of styling, Webpack and I was an author a half of the front-end part of the application. In that project, I learned the React library in deep.

Currently, I live in Gliwice where I am a front-end developer at Skygate. I develop my programming skills by working on a project for the biggest pharmaceutical company in Europe. The application presents large amounts of data in the form of charts and tables. That is the largest and longest-lasting project Skygate currently runs, and I lead that project in cooperation with other developers and QA. As a project leader, I constantly improve the work-flow by introducing new technological solutions that significantly improved the work in the project and release management

I am also the main architect of technical requirements for candidates and I am involved in every technical part of the recruitment process. Because of my experience and willingness to help I am frequently asked for help in other projects. Because of my ability to share the knowledge I conduct internal training.

In my free time, I learn new technologies, explore the JavaScript ecosystem and follow the current trends. In the future, I want to be a tech-lead with a wide range of tools that will help to change the world around me. To do so I try to surround myself with inspiring and full of passionate people I could learn from.

Projects

Landing page

Avax

Project details

Avax

Landing page | August 2018

I have created this cool landing page from *.psd file. This was a very instructive project for me.

Many sections of this project pushed me to find the best solution. Instead of using regular css I've decided to use scss and its advantages, for example: splitting components and sections into multiple files, variables, and nestings. Avax uses a custom themes for google maps setted with use of its API. This approach allows to enjoy maximum performance as well as control of visual appearance. Lighweight free carousel Flickity is one of my favorite. Despite its small weight it provides many useful features and it can be controlled using vanilla js which was my goal, because I didn’t want to use JQuery. I need to mention something about my script for filtering projects. I'm very proud of it because I was able to combine 'data-set' and JavaScript to make it work.

It's not possible to write everything just in several sentences. That is why I encourage you to get familiar with the source code and see how it works online by clicking proper buttons down below.

Project preview

Game

Sudoku

Project details

Sudoku

Game | July 2018

Here is my version of this common game.

This project was created during a Web Developer bootcamp. To make my game I used the free library „Sudoku-umd” that generates sudoku. To build front of my app I decided to use React, and its 'reactive' rendering was a great solution, because I wanted to rerender only that the field that changes. I decided to use Redux for state management, that made the state of the app more predictable and it was a great opportunity for practicing Redux with React. I tried to create a fully responsive game with functionalities that will allow you to choose the level of difficulty, show some hints and even solve the game for you. I hope you will enjoy it.

You can try sudoku for yourself by clicking 'go live' or watch my code and read the readme file by clicking the 'view code'.

Project preview

Isomorphic App

Kanban

Project details

Kanban

Isomorphic app | July 2018

This is the bigges project I've made so far. My app handles CRUD operations for columns and notes, as well as provides a 'drag and drop' functionality for notes which is possible due to the react-html5-dnd library.

From a technical side, the application is as follows. On backend I've used Express.js to create a server. RESTful API is responsible for handling the CRUD operation on mongoDB database (hosted on MLab). Of course I’ve used a Mongoose to make a work with database more comfortable. To generate modules, components, models I've chosen a mern generator that uses EJS templates. A development environment is managed by Webpack and NPM scripts. On frontend views are generated by React while Redux manages a state of the app. Since it's an isomorphic application, its state is managed asynchronously by Redux-thunk. The whole project was based on the MERN-template.

The application has been placed on the Heroku website, therefore the first launch might take a while, because Heroku disables applications that are not currently in use.

Project preview

Single Page App

Country App

Project details

Country App

Single Page App | Juni 2018

Country is a classic expample of Single Page Applications. It presents the basic information about the selected country in an interesting way.

The app was created with React and React Router libraries, and entire rendering lies with a client side. Information about countries are loaded from *.json file. A user can filter the list of countries depending on a chosen continent. Clicking the flag app enables viewing a proper component that presents detailed information about a chosen country. There are also buttons for removing a country from the list. By using the contact component, you can go to my portfolio or send me an e-mail. You can switch between main components using navbar on top.

The process of creation of this application has helped me to understand the philosophy of SPA, as well as to practice the most popular frontend JavaScript libraries.

Project preview

Single Page App

Intranet

Project details

Intranet

Single Page App | November 2018

Intranet is a Single Page Application. It contains boilerplates of subpages for future development.

One of the subpages is already implemented and this subpage is Toolbox. Toolbox presents categorized lists of internet links and allows you to filter that lists via category name and link name. The App is also easy to nationalize. I've' used React Intl to implement this functionality. The Language can be switched by a single click in button inside the footer.

Creating this app allowed me to dive in React and React Router in their newest versions. I've learned how to use React Motion library with React Router to create cool transitions between rendered components. I've styled my app using SCSS modules. Intranet is ready to use not only on a desktop but also on mobile devices and thanks to PWA mechanism It can be used offline.

Project preview

SINGLE PAGE APP with DnD

Books

Project details

Books

Single Page App | December 2018

Book app is an interesting concept of presentation data from external API, but it is also a challenge with implementation drag and drop mechanism without using HTML5 DnD API or any other JavaScript plugins.

This project has stimulated me to be creative and it has encouraged me to get more knowledge about JavaScript. During the creation of this app, I was able to apply MVP (Minimum Valuable Product) pattern. To do so I have decided to start from scratch, so I have prepared tools and data. Then I got the idea about dnd and fortunately, it worked. My next steps were a migration the apps state to the Redux and get data from external free API, because at the beginning I have been using a *.json file with dummy data. My last steps were styling the app in a fancy way, add PWA mechanism and deploy the app on GitHub pages. Since my drag and drop algorithm has been finished the app became MVP.

This project wasn't that hard to implement but pushed me to think more about common and repeating actions in JavaScript. And also it allowed me to combine regular event listeners with their equivalents in React. It was a great fun for me.

Project preview