DEV Community: Vadim Stakhnyuk

Data Structures and Algorithms Helpful Resources

Vadim Stakhnyuk — Mon, 11 Nov 2019 10:10:11 +0000

Over the course of every programmers life. They will eventually run into data structures and algorithms. Some people can understand these better and faster than others, but everyone needs to practice them. Being a new developer in a very competitive market, you have to stand out and prove yourself as a better programmer than all the competition. Although data structures and algorithm's aren't all the tools you need when it comes to programming or searching for a job, it is one of the major ways that company's test potential candidates for a job. Online, there are many resources that are available to developer when it comes to learning and practicing data structures and algorithms. In my journey as a developer, I have tried a few of these resources, and I found success when it came to practicing algorithms and gaining more knowledge.

There are tons of resources out there, and I cannot cover all of them, But I would like to share a list of resources that I use that help me when it comes to practicing data structures and algorithms.

My favorite resource is codewars.com. I really like using this resource because there is a large abundance of different types of problems to try to solve. Along with that, there is a leveling up aspect, so the more problems you solve, the more you level up and receive cool benefits. Along with every problem there is also a conversation board where you can compare answers and talk about the problem with other users.
Another very useful resource is leetcode.com. This is one of the more popular resources and is very commonly used. Like codewars, leetcode has a large abundance of problems as well as a forum for coversations with other programmers. Leetcode does not offer an answer in a selected programming technology. Most of the answers are in Java or another one of the older programming languages. One benefit to leetcode is that you can select the difficulty of the problems you want to solve.
A very great resource is youtube.com. Although this resource does not have a built in IDE, youtube has an infinite amount of videos and help that any programmer can use to either learn about or practice data structures and algorithms. Not only that, but anything programming related can be found on youtube.
A lot of the times, paid for online courses from resources such as udemy or udacity can help brush up your skills by taking classes and learning from other programmers and instructors who understand data structures and algorithms very well. A great aspect to these courses is that they are rated and have feedback, so you can learn from other programmers and find out if the course is good or bad.
One of me absolute favorite resources is freecodecamp.com. With many different types of course available at no cost, this resource has a great course on Javascript Data Structures and Algorithms. Although it is an intense and long course, it is helpful for brushing up on skills and achieving that much needed practice on data structures and algorithms as well as Javascript in general.

I hope this short little blog helped you in your search for help with data structures and algorithms. Although this is not much, I use these resources a lot to help me learn and practice.

Persistence Algorithm and A Simple Introduction To .reduce()

Vadim Stakhnyuk — Mon, 04 Nov 2019 03:56:46 +0000

As my hunt for a job position continues, so does my Algorithm practice. Day after day I am introduced to new concepts and learn new ways to solve problems. This time around, while working on the CodeWars "Persistent Bugger" algorithm, I learned about the Javascript .reduce() function and implemented it into my algorithm successfully.

The .reduce() function has a lot of working pieces, and is extremely useful for solving mathematical problems. To start, we can say that .reduce() takes an input and combines it and returns the input but in combined form. For example, an input of an array of numbers can be returned as a sum with the .reduce() function. In the "Persistent Bugger" algorithm, that is exactly what I was doing.

Let's start with the basic functionality of the .reduce() function and how it is set up. I will setup an example with an array of numbers, and I will return the sum of these numbers. This is a great way to display the functionality of the reduce function.

The .reduce() function receives an input of an array of numbers

let numbers = [1, 2, 4, 5];

let total = numbers.reduce((sum, currentValue) => {
   return sum + currentValue;
});

console.log(total)

We call the reduce function on our array of numbers with 2 arguments.
The first argument is the sum, which will be initialized to the first value of the array.
The second argument is the current value.
Inside our function, we return the sum of the current value added to our total.

This is a simple example of how the reduce function works. Although you can call the reduce function with more arguments, this is a simple explanation and example of the function at work.

Now, we can take a look at the algorithm. This is a great algorithm, and was definitely fun to solve. Basically, the input is a number as a string. You have to find the multiplicative persistence of that number. This means you have to keep multiplying the number until the return number is a single digit.

Let's say our function is called persistence, here is a look at some example inputs and outputs.

1.) persistence(39) === 3

3 * 9 = 27, 2 * 7 = 14, 1 * 4 = 4. We had to multiply 3 times in order to reach a single number. Therefore, the answer is 3.

2.) persistence(999) === 4

9 * 9 * 9 = 729, 7 * 2 * 9 = 126, 1 * 2 * 6 = 12, 1 * 2 = 2. Four calculations to reach a single number.

The approach I took to solving this algorithm started with the parseInt function where I took a string and turned it into a number. Then I split that number so that my input could be an array of numbers. Then I initialized a count variable so that I could count how many times I multiplied the input. I also declared a total variable. This variable is the input that was passed into the .reduce() function.

function persistence(num) {
    // change the number into a string and 
    // split the number into individual numbers.
    var numArray = num.toString().split('');

    // Initialize a count variable to count its
    // multiplicative persistence.
    let count = 0;

    // Initialize a total variable.
    let total;

    // While loop to make function run only when the split
    // number has more than 1 element.
    while (numArray.length > 1) {

        // Set the total variable equal to the reduce function
        // which gets the sum and gets multiplied by the current
        // value in the loop.
        total = numArray.reduce(function (sum, currentValue) {
            return sum * currentValue;
        })

        // Increment the count variable
        count++;

        //split the new number and reset the function.
        numArray = total.toString().split('');
    }

    // If the new number is no longer greater than 1,
    // then that means we reached the end.
    // Return the count.
    return count;
}

That is a short introduction to the reduce function as well as my little journey into discovering it. Also, how I used the reduce function to solve my algorithm. This "Persistent Bugger" algorithm is a fun to solve algorithm and shows a new way to calculate numbers.

Reversing A String Using Pointers(References)

Vadim Stakhnyuk — Sun, 27 Oct 2019 05:03:37 +0000

In my hunt for algorithm practice, I came across an algorithm that is pretty common known as reversing a string. There are many ways to reverse a string. These many ways commonly get filtered out based on the way either a problem description or an interviewer wants you to solve the problem. At first, not reading the directions, I dove straight into this problem. Having seen this problem before and having minimal knowledge off the top of my head, I began solving this problem by allocating more memory storage and creating a new array with which I can loop through the old array starting from the last element and going down to the first, and pushing all the elements from the string into the new array.

var reverseString = function(string) {
    let reversedString = [];
    for (let i = string.length - 1; i >= 0; i--) {
      reversedString.push(string[i])
    }
    return reversedString;
};

reverseString(["h", "e", "l", "l", "0"])

input = ["h", "e", "l", "l", "o"]
output = ["o", "l", "l", "e", "h"]

Having figured out the answer on a separate programming IDE, I went ahead and tried submitting the problem. At this point I was hit with a "Incorrect Answer" message. I quickly went back and reread the directions. This time I saw that I was not allowed to allocate memory by creating a new array.

At this point, I knew about the Javascript function .reverse() and how easy it would be to solve the problem with this helper function. Sure enough, I was able to complete the problem and the website was able to accept my answer.

var reverseString = function(string) {
    return string.reverse();
};

reverseString(["h", "e", "l", "l", "0"])

input = ["h", "e", "l", "l", "o"]
output = ["o", "l", "l", "e", "h"]

After looking at this problem, I imagined having to solve this algorithm problem in an interview scenario, which is definitely a possibility. Having this thought, I knew the possibility of using helper functions such as .reverse() may not always be accepted.

At this point, I cleared my IDE and starting going at this problem using pointers and modifying the origin array without creating a new one and not having to use helper methods such as .reverse().

I was able to use indexing and having pointers set to the first and last letters and then incrementing towards the middle of the array and swapping the letters.

var reverseString = function(string) {
    let left = 0;
    let right = string.length - 1;
    while (left < right) {
        let temp = string[left];
        string[left++] = string[right];
        string[right--] = temp;
    }
};

reverseString(["h", "e", "l", "l", "0"])

input = ["h", "e", "l", "l", "o"]
output = ["o", "l", "l", "e", "h"]

This was my little journey coming upon an algorithm and using a few of the many ways that you can solve this problem. Ultimately in the process, I learned about using pointers to help solve problems such as this one. Using pointers is a great way to reverse strings without allocating additional memory with a new array.

The Importance of Building Projects

Vadim Stakhnyuk — Mon, 21 Oct 2019 01:47:29 +0000

There are many ways to examine the growth of a software engineer. Whether it be through exams, or quizzes, or projects, or different kinds of assignments. Projects are one of the best ways to do it! I will talk about the importance of project building and how it can impact the way an individual examines you're learning progress. The term “project” has many degrees of understanding. There could be big projects or little projects. In the software engineering world, any kind of project has the ability to render the skills or understanding of a language or concept.

All Projects Start With an Idea

As a software engineer, sometimes it can be hard to visually demonstrate how passionate you are for the field. All projects start with an idea. Something that you have a desired interest for. This is a great starting point when it comes to building your project. If there is a desire, there is a purpose. This will come in handy when you find yourself working a lot on your project. It will show that you have a purpose for the creation of your project. With that drive, you will see yourself working on your project during your free time. Not only is this good for gaining valuable experience, it also helps you create a good routine to always be enveloped in code. It is good to break through our usual routine of doing what we are told to do, and to spend some time building something we have a passion for. Every software engineer has an acquired taste when it comes to projects, wether it be a game, a website, a cool application. It all helps build experience and leads to writing better code. Experience is very valuable when it comes to software engineering, and there is no better way to get that experience other than through building projects.

Building With A Passion

This part of the project building process is very important. A project built without passion will most likely not end up being very good. Projects built with passion show a love for software engineering. If you are passionate about what kind of project you built, the people who will hear you talk about your project will see that passion. This is why it is so important that when employers ask about your projects, you have the ability to show them that you love to program! Sometimes, it can be hard to find something to build that you are passionate about. A great idea would be to re-create a website that you commonly use. By doing so, not only will you have an interest in creating that website, but that re-creation can look very good on your portfolio. Especially if you apply for the company who's website you recreated. If you have decided to try and learn a new programming language, build a small project with it. Projects show growth and understanding which are valued by companies seeking engineers. Another great way to show your expansion and growth is to work on a series of projects that have an increasing difficulty. Showing growth can be difficult, but building projects in such a manner will show growth and a drive to learn more! These aspects are also very valuable to people such as employers who are taking a glance at your portfolio. Post a video of your project online, deploy your project, share your project on social media. Be proud of what you created! This will show your passion and the happiness you get from programming!

Project Importance On Your Portfolio

The job search is the most exciting and scary time for new developers. Going through the process of applying jobs and finding the right fit can be challenging. It is in this process, that I have learned how important projects can be. Your projects are the most important thing on you portfolio. These projects show you're learning curve, they show your coding style, they show your strengths and your weaknesses, but most importantly, projects show your skill level. When recruiters look at your portfolio, they look at your projects. This can easily dictate your chances towards getting an interview. During meetups, and engineer talks, many people suggest building projects that can show your passion and your drive. For this reason only, I think it is important to build projects the right way. Especially since for some people, coding does not come naturally. Being able to talk about something you have built with passion is very highly looked upon. Especially with recruiters and other engineers. In conclusion, I would like to summarize that it is important to build projects in order to expand growth and experience. It is also important to build projects that can show you're learning curve. Ultimately, it is important to build projects that can project your passion and desire towards coding.

Passing Down Functions As Props in React

Vadim Stakhnyuk — Mon, 08 Jul 2019 21:23:10 +0000

Approaching the end of my journey at Flatiron School, one of the more interesting and hard subjects to learn was React. After learning pure vanilla JavaScript and being able to write an application with it, we learned the capabilities of react and how useful it is as a framework. With the transition to react, we are introduced to JSX, which is an implementation of both JavaScript and html all in one. One of the hardest things about the transition was the general use of the framework. In JavaScript, we had separate files for html and javascript. Whereas now, it’s all JSX and multiple components of an application. We are introduced to state and props, and the component lifecycle. Creating functions and making them work with state was a challenging part of the learning curve. I had a problem in a project where in the child component, I had an onClick function, and I needed that onClick function where state was, which was in the parent component. I got stuck on how to pass my function down from the parent component to the child component. When I was doing research on how to pass down functions as props into different components, I saw a lack of information on the web. So I decided to write this blog in case anyone else feels confused in this part of the React learning process.

Creating Functions at the State Level Components

When working with state, we typically want state to be in only 1 component. In other terms, we want the lowest number of components with state as possible. This means that in order to change state in a different component, we have to pass down our functions as props to the component that needs to change state. This way, we can have functions in our child components that are able to change state. This is very useful for cases where you have a child component that has an onClick function or an onChange function that needs to change state in order for the user to see the correct information on the screen.

Passing Down Functions As Props

The process of passing down functions as props can be very confusing. It happens during the render, where you call a new component. During that component call, you pass in your function as a prop. In my demonstration, I pass in the prop as "clickMe".



import React from 'react';
import './App.css';
import NewComponent from './components/NewComponent';
// import NewFunctionalComponent from './components/NewFunctionalComponent';

class App extends React.Component {

  constructor(){
    super()
    this.state = {
      isClicked: false
    }
    console.log(this.state)
  }

  handleClick = () => {
    console.log('I have been clicked')
    this.setState({
      isClicked: true
    }, () => console.log(this.state.isClicked))

  }

  render() {
    return (
      <div className="App">
        <NewComponent clickMe={this.handleClick} />
        {/* <NewFunctionalComponent noClickMe={this.handleClick} /> */}
      </div>
    )
  }
}

export default App;

With this simple demonstration, I have created a react application that changes the state with the click of a button. In the render, when I reference the "NewComponent" component, I pass the "handleClick" function down into the child component. This way, I can reference that function in my child component.



import React from 'react';

class NewComponent extends React.Component {

    clickMe = () => {
        this.props.clickMe()
    }

    render() {
        return (
            <div>
                <button onClick={this.clickMe}>Click Me!</button>
            </div>
        )
    }
}

export default NewComponent;

In this child component, I have an onClick event handler. I also created a helper function during the onClick event. Now, our onClick event can be functioning due to the fact that it is passed down as props into our "NewComponent" component. I can also pass back props or an event back to the parent component is I include it in my function. Here is an example,



//You can pass in props back to the parent element like this.

clickMe = () => {
    this.props.clickMe(props)
}

OR...



//You can also pass an event. I am passing in the value of the event as an example

clickMe = (event) => {
    this.props.clickMe(event.target.value)
}

Same Scenario But Using A Functional Component



import React from 'react';

const NewFunctionalComponent = (props) => {
    return (
        <div>
            <button onClick={() => props.noClickMe()}>No, Click Me!</button>
        </div>
    )
}

export default NewFunctionalComponent;

Demonstration

I have included some console logs to show the process of state changing. Before any kind of action is done, the default state is "false". After the click event, the state changes becomes "true". This is to show that throwing functions into different components actually works.

Conclusion

React is basically magic. It is a very powerful tool when it comes to making online web applications. The use of state and props is vital for presenting things to the user. I have created a simple demonstration showing the capabilities of being able to pass functions down as props. This way, you can have the ability to maneuver around in different components and still have state in only one component. It is scary to see how many helpful functions we have with React, and the more you learn about React, the more exciting it becomes. As the possibilities become endless with what you can create.

Using Javascript's setInterval() and setTimeout() Function

Vadim Stakhnyuk — Thu, 27 Jun 2019 00:25:11 +0000

Utility

In the world of web development, often times we need to adapt and overcome the challenges that we face. Many times we have to put up with trying to tackle something that is beyond the scope of our understanding. It can become very frustrating at times when things don't end up working the way we want them to. As new developers, figuring out the ins and outs of Vanilla JS, we can find ourselves struggling to come up with a solution. That is something I have recently experienced working on a project. The project required a reminder function. Something that can compare the current date/time to an assigned date/time. It was important that I had taken the correct approach to solving this problem. Thinking about it how it will function got me doing research. This is where I ran across the setInterval() function and the setTimeout() function. These functions have many applications. You have the ability to constantly change your background and utilize all of these cool features with the setInterval() and setTimeout() functions. I will share the way these functions can be utilized, and how I utilized the setInterval() function to suit my needs for my Reminder function in my project!

setInterval() and setTimeout()

These functions are very similar, yet very different. Both are very useful when it comes to timed events in Javascript.

setInterval() is a time interval based code execution method that has the native ability to repeatedly run a specified script when the interval is reached. Also, setInterval() loops by default. So there is no need to loop with setInterval(). This function runs until the function clearInterval() is called, in which it breaks the loop.

function myFunction() {
  let interval = setInterval(mySecondFunction, 3000, param1, param2)
}

function mySecondFunction(param1, param2) {
  return "calls this function every 3 seconds"
}

setTimeout() is a time based code execution method that will execute a script only one time when the interval is reached. This function will not repeat itself unless it is called inside of a loop. If put inside a loop, setTimeout() will keep running until clearTimeout() is called.

function myFunction() {
  let interval = setTimeout(mySecondFunction, 3000, param1, param2)
}

function mySecondFunction(param1, param2) {
  return "Hello!"
}

Implementing setInterval() In My Project

While working through my Reminder function, I had to figure out a way to create a function that can compare current time to assigned time. The difficult part was that,

I needed to create a function that checked the time to see if it matched a chosen time.
I needed a way to call that function all the time so that it would always be checking to see if the times matched.

The way I solved my problem was by setting up a setInterval() function that called a function every second. This function would check the current date/time and see if it matches the date/time someone set for the reminder. Although this is not efficient, if working with only Vanilla JS, this may be the only way to do it. Next, if the set date/time matched the actual date/time, I stopped the interval using clearInterval() and was able to render a pop up and an audio aspect to my reminder function.

Myinterval = setInterval(setReminder, 1000, ev, newCard);

if(actualTime == alarmTime && currentActualDate == selectedDate) {
    audio.play();
    endReminder(newCard);
  }

Conclusion

Although Javascript can be very frustrating at times, there are many methods that can serve as very helpful. The functions I went through in this blog are especially helpful if there is a desire to call a function every so often, or if you need to call a function after a certain amount of time. Either way, functions such as setInterval() and setTimeout() are what makes Javascript such a special language to work with. The more that is learned about how Javascript works, the more fun it becomes coding with it!

Building A Foundation For Your Network

Vadim Stakhnyuk — Mon, 10 Jun 2019 23:25:37 +0000

As tech evolves, the abundance of jobs as well as the possibilities at a tech career are very abundant. Recently passing my halfway mark in Flatiron's software engineering immersive, I began to look into the future and what it holds. I started doing research, started following people on LinkedIn, started to watch videos to help get a head start for what awaits in the future. Having read many articles and watching many videos, it seemed that the word "networking" is always present. At first, I kind of ignored this word and was focused on the interviewing side of things. Looking at data structures and trying to practice algorithms. But the more I saw the word "networking" the more I wanted to envelop some knowledge into why it is so important to network.

As someone who is very interested in starting to network, I created this small informative guide that will not only benefit me, but can also help others trying to achieve the same result of creating a successful network.

Getting Out Of Your Comfort Zone

One of the most important steps in networking is getting out of your comfort zone. I, like many people, have some fear in going out and meeting new people. It is hard to get out of a regular routine, and take time out of the day to go meet someone who you don't know. Many people have very busy schedules, they go to school/work, come home to do more school/work. To find time to attend a meet-up or a social gathering is tough, but it is vital in building a professional network.

As someone who has not even started the job search, I can already feel how powerful a great network can be. Having the ability to utilize your network to help secure a job can be very rewarding.

Creating A Professional Network

Networking is not about going out and just talking to people. To build a proper network, you need to build friendships. Trust needs to develop between you and your network. Many people have their own style of building relationships. Some people like to join a group of people, others prefer a one-on-one style of approaching people. Find your ideal way to approach people. A great way to network is to go to events. Find out when an engineer from a company will be speaking. If you go to an event that you are interested in, chances are that someone there will have the same interests as you. There are many events on social media platforms such as "Meetup" or "Eventbrite" that could be very useful when it comes to finding networking opportunities. Another useful platform is LinkedIn. I recently found myself following people who provide great amounts of useful information about job seeking tactics, and networking tactics. Seeing as how important networking is, doing a lot of research can make a big difference in how you build that network.

Once you have found yourself in the presence of a person/group of people, build your relationship! Start making friends. Another very important aspect is to ask questions. How did those people get the job? What can I do to fit in? In a recent study from 2016, shows that 85% of jobs are filled via networking. That is an astonishing number. It shows that networking should be the go-to method for job-seeking candidates.

Although networking is something used across many different professions, it is especially vital for software engineers. There are many applicants to every job, and the interviewing process can also be very difficult. The benefit to having a great network is that if none of your contacts have job leads, they may know someone that has a lead on a job. Networking can be seen as a tree with many branches. The branches being your many different connections through the people in your network. Another reason as to why it is important to become friends with your network rather than using them just to find work, is that they can help you. If your connections have job experience, they can show you how to prepare for an interview, they can help guide you on what to do to get that job, they can review your work and help make your code look more presentable.

Doing all this research has helped me solidify my approach towards networking. If you can create a proper network, build lasting friendships, and get your name out there in the field... You will find yourself at a good starting point to get your foot into the software engineering world.

References Used:

A Better Programming Experience With VSCode Extensions

Vadim Stakhnyuk — Wed, 29 May 2019 23:33:31 +0000

As software engineers, a lot of our time is spent looking into a computer screen for countless hours. Endlessly typing in code into a text editor. Most text editors come equipped with “standard” features that offer a good user experience. But some text editors, such as VSCode, allow you to download various extensions to provide a more useful and a more enjoyable programming experience.

Being a student at Flatiron school, I recently discussed with a teacher and a few students about VSCode and different types of extensions and what they do, so I was compelled to make a review-type post to help any other students who are looking to add some extensions to VSCode to further amplify their programming experience.

I have compiled a list of various VSCode extensions that I use to make my coding experience much easier and much more enjoyable.

vscode-icons - VSCode Icons Team

This extension helps with organization. Having the little icons also makes it more visually appealing. If you open a new folder for your code, the little icons will populate based on what kind of files you have. For example, a ruby .rb file will have a small ruby gem icon. Another example would be if you have a folder containing code, the icon is a small little folder. Although this extension is not necessary , it makes your work place more visually appealing and helps with organization and knowing where everything is.

Bracket Pair Colorizer - CoenraadS

Bracket Pair Colorizer is one of my favorite extensions! If you like to have your code easy to read/write, this is a go-to extension. Before I installed Bracket Pair Colorizer, a lot of my code was written in the same color, and it all looked the same. It was harder to find where brackets ended, and which code belonged where. After the installation, I found my code easier to read. All the brackets had their own color, and the font would also change color. This contrast in colors helped identify what code is supposed to be inside parentheses or brackets. It also helped the code look better from a visual perspective.

Simple Ruby ERB - Victor Ortiz Heredia

Working with ruby and the MVC structure, a lot of time is spent working with views. Views are .erb files that render as HTML files. This extension is useful for auto-completing tags as well as providing other helpful tools when creating views inside of your ruby web application.

Ruby - Peng Lv

If you are using the Ruby language, this extension is a must. It contains very useful features such as debuggers, linters, auto-complete features, along with many other useful tools. The Ruby extension provides every ruby user with almost all the useful features that they will need. To install some features, you need to download gems into your workspace. After this, the extension is fully at your service.

With VSCode extensions, you can amplify your coding experience. Being programmers, we spend a lot of time within our code. So why not have some fun and make it look cool and provide some ease to your coding experience. VSCode Extensions are there for you for that reason!