Today is Valentines Day! 😍 How nice would it be if you sent a Romantic Message every hour to your loved one? But even better... How awesome would it be to do it automatically using a NodeJS script? We are after all... programmers, right? 😏 In this…
At the end of 2019 I promised that 2020 will be all about my YouTube channel. So that's what I did. 😃 On the first day of January I started the #31Days31Videos challenge in which I had to upload a video on my channel, every single day, for the…
In this post we're going to take a look at how 2019 was for me (mostly professionally) and we're also going to set some goals for 2020! 🤩 I really love numbers so I'm also going to show you how 2019 was in numbers and I'm going to share some of the…
Yesterday I finished the #100Days100Projects challenge 🥳 and in this article I’m going to cover my experience doing this challenge and I’m also going to answer some of the questions that I received on Twitter about this. It would be an “ask and…
I’ve been dreaming for years to start creating YouTube videos and it finally happened! 😍 Last week I had the courage to create my first YouTube video - and it was an amazing experience! In this article I’m going to tell you all the ins and outs of…
On day #032 of the #100Days100Projects Challenge I saw this effect that my buddy Kyle Shook created and I thought: "Hmm... this would be nice as a project for the challenge", so... I did it! In this article I'm going to show you how I did it…
A couple of days ago I created this Falling Snow Effect for day #031 in the #100Days100Projects Challenge and in this article I'm going to show you how easy it is to create such an effect using only vanilla JavaScript and a little bit of CSS. You can…
30 days ago I started the #100Days100Projects challenge and in this article I'm going over the last 15 projects that I've built. You can check out the article in which I explained the first 15 projects here. Note: You can also join the challenge if…
Two weeks ago I started the #100Days100Projects challenge and in this article I'm going to showcase all the projects that I've built since I started. 😄 Note: You can also join the challenge if you want as there are other variants too if you feel…
For the first project in the #100Days100Projects I thought about working with a public API in order to get some data that would be displayed in a webpage; an usual thing to do with an API. For that I chose to use TheMealDB's public API in order to…
Update: I finished this challenge on 25th December 2019. Read more about my experience here. Purpose 100 Days - 100 Projects it's a challenge I'm going to take (and you can join too) starting today (17th September 2019) that it's meant to improve my…
Yesterday I was talking with @ildiesign about the fact that I needed a component which I could use on all of my mini-projects on Codepen in order to make it easier for people to find my Social Media profiles. Today, she came up with this A.W.E.S.O.M…
I've came across this simple and clean 404 page design created by @ildiesign and I thought I would make a quick tutorial on how to build something like this. You can see the live version on Codepen: https://codepen.io/FlorinPop17/pen/JjPvJzz The HTML…
Some of you might know, last week I created a challenge for myself together with my wife: I had to make $200 💰 in 4 days using my programming skills. I started by having 0 projects / 0 clients, so I had to find some gigs to finish this challenge…
Below you can find a list of ways you can make money as a developer. I've wrote these items a while back and I thought that people might find it valuable so I decided to share it with you. The most common is to have a job at a company or work as a…
Problem description Given a string, count the number of occurrences of all of its letters. Some cases: Before reading forward, make sure you first try to solve the problem yourself. When you're done you can come back and see how I'm going to solve…
A coding challenge from Codewars. Problem description Polycarpus works as a DJ in the best Berland nightclub, and he often uses dubstep music in his performance. Recently, he has decided to take a couple of old songs and make dubstep remixes from…
Often when you have a table with information you'd want to be able to sort the information in the table in ascending or descending order, especially when you are dealing with numbers. In this tutorial we're going to see how to do exactly that using…
The theme for week #19 of the Weekly Coding Challenge is: Testimonials If you are looking to find new clients it's important to gather reviews / testimonials from old clients you've worked for to show them to your new clients. When you gather a few…
In this article we are going to go over a coding challenge from Codewars. Problem description Return a new array consisting of elements which are multiple of their own index in input array (length > 1). Some cases: It's a simple problem, but we'll…
The theme for week #18 of the Weekly Coding Challenge is: Social Media Buttons We all know how important is Social Media nowadays for a business (be it either a blog or a product/service selling business) because of the amount of people using it. You…
The theme for week #17 of the Weekly Coding Challenge is: Pagination A Pagination Component is used on websites where you have more content available than you want to display at one time to the user so you'd split it on multiple pages. By separating…
The theme for week #16 of the Weekly Coding Challenge is: Notifications The notification component is used in a web/mobile app when you want to notify the user that something happened based on his action - "successfully completed registration…
The theme for week #15 of the Weekly Coding Challenge is: Instant Search We live in a fast world and we want everything to be FAST, including search results, this is why instant search functionality became pretty much a "must have" feature instead of…
The theme for week #14 of the Weekly Coding Challenge is: Progress Bar A progress bar is used to show how far a user action is still in process until it's completed. A good example is a download progress bar which shows you how much of the file is…
In this article we are going to go over another problem from Codewars. Problem description Divisors of 42 are : 1, 2, 3, 6, 7, 14, 21, 42. These divisors squared are: 1, 4, 9, 36, 49, 196, 441, 1764. The sum of the squared divisors is 2500 which is…
The theme for week #13 of the Weekly Coding Challenge is: Accordion Hide and show content with just a click - this is what an accordion let us do. 😃 In this article we're going to build this Accordion: https://codepen.io/FlorinPop17/pen/PvvZmN/ The…
The theme for week #12 of the Weekly Coding Challenge is: Toggle A toggle (or a switch) is a component which allows you to change a state / a boolean value from true to false and vice-versa. It is basically a , but we are going to hide it and display…
The theme for week #11 of the Weekly Coding Challenge is: Tooltip A tooltip is a message which appears when you hover over an item. Usually this item is an image, a hyperlink or an icon. In this article we're going to build a Tooltip with Pure CSS…
Recently I had to create a Countdown for one of my other projects and I thought that it could also make a good tutorial, so in this post we're going to create this component using React and a little bit of . 😄 You can find the final result in this…
The theme for week #10 of the Weekly Coding Challenge is: Clock When it comes to clocks, there are a wide range of possibilities that we could approach. This challenge aims to get your creative juices flowing! Let's see what you can create! 😄 In…
The theme for week #9 of the Weekly Coding Challenge is: Modal We have another one of the main components that is found on most of the websites. A modal is used to attract the users attention to some special information that you want to highlight. It…
It's been a while since I did a JavaScript Coding Challenge so I thought that I should bring it back this Friday (let me know if you like these and I'll add a new one each Friday). 😄 I searched on Codewars and found a challenge to Create a Phone…
The theme for week #8 of the Weekly Coding Challenge is: Chat Interface Everyone is using a chat of some sort nowadays so in this article we're going to create the bare bones of a chat application. We'll start with the HTML/CSS to create the layout…
Two weeks ago I published an article containing 15 project ideas that you could build to level up your coding skills and people were very excited about that resource. Also, the app-ideas repository got almost 3000 stars since I published that article…
The theme for week #7 of the Weekly Coding Challenge is: Portfolio As a developer it is highly recommended to have a portfolio with some of the projects that you've been working on. I say some, because maybe not all of your projects are worthy to be…
These days I've been working on a new page for my website. I wanted to have a Timeline to showcase some of my professional accomplishments over the years. I did it for a couple of reasons: My future self will look back one day and say: "Wow... I…
The theme for week #6 of the Weekly Coding Challenge is: Button "A button? 🤔" you might ask... Yes! A button! 😄 "But why?" Because a button is one of the building blocks of any website/web application. Either you are on facebook or twitter or…
Last week I found something that amazed me. A designer that took the 100 UI Design Challenge to a whole new level! She's been creating a new design every workday for the past 3+ years (800+ designs)! Amazing! 😮 You can find her on dribbble as…
The theme for week #5 of the Weekly Coding Challenge is: Drawing Application This is the first application that we are building in the #weeklyCodingChallenge program. So far we have built smaller projects, so this is pretty exciting if you ask me…
Have you ever wanted to build something but you had no idea what to do? Just as authors sometimes have "writers block" it's also true for developers. Together with my friend Jim we created a collection of application ideas which is intended to solve…
The theme for week #4 of the Weekly Coding Challenge is: Loading Animations Every time something is loading on a website it's a good practice to give some sort of feedback to the user, make him aware that his request is being processed. Most of the…
I promised in the last article that we're going to have a look at how to solve the Regular Brackets problem with multiple types of brackets, and as I said last time we're going to use a data structure called: the STACK. 😄 In computer science, a…
The theme for week #3 of the Weekly Coding Challenge is: Navigation A navigation component is crucial on a website because you want your users be able to easily navigate through your pages. You can find a navigation component even on single page…
Today we're going to take a look at a very common challenge used in job interviews. This challenge is inspired by CodeSignal. Let's see what it says: A bracket sequence is called regular if it is possible to insert some numbers and signs into the…
Update: I also created a YouTube video for this tutorial. Check out below! I've been playing around the past week with this CSS animation and I thought that it would be nice and useful to write a short article about how we can create it. Below you…
New week! New Challenge! 😄 The theme for the second week of the Weekly Coding Challenge is: Create a Slider A slider is used mostly to showcase content like: images, projects in your portfolio or even testimonials from clients. It is useful because…
It's Friday, so it's time to get comfortable, weekend is coming 🙌, and for today we have a very easy JCC (JavaScript Coding Challenge)! Here is another easy, and beautiful 😇 challenge from HackerRank: Lily likes to play games with integers. She has…
Introduction Some of you might know (or if you don't, you will find out now 😉) that I started a Weekly Coding Challenge program for developers which is beginner-friendly and aims to help them learn, practice and/or improve their development skills…
Some of you might already know but for those who don't, I'm starting a weekly Coding Challenge with all of you! 😄 This is how I'm planning to make it work: Every Monday I'm going to post an article about how I'm solving a different Coding Challenge…
A couple of days ago I received and email from HackerRank. They invited me to solve one of their challenges so... That's what we're going to do now! You are in charge of the cake for your niece's birthday and have decided the cake will have one…
For today I was thinking that we could build an App using React, and because the people from the Chingu group I'm in are working to create a Book Finder App I decided to build something similar. I also wanted to avoid building the exact same app as I…
For this post I've decide that I'll teach you how to create a Pricing Plan component as the one shown bellow: Pricing Plans snapshot This kind of component is used on most of the SaaS (Software as a Service) presentation websites where people can…
Today we're going to solve another Coding Challenge. This one is categorized as: "intermediate" Coding Challenge. Uuuuuh Personally I don't think that this is that much of an "intermediate" challenge, but... doesn't really matter, the important…
Some of you might not know the following thing about me: I LOVE CODING CHALLENGES and I've been "playing" around with them for a long time now... This helped me pass multiple Coding Interviews with ease for some really interesting Job Interviews (if…
It's been a while since I wrote something on this blog and I want to apologize for that... I should have put more time in it as people requested it. BUT... I'm back And I'm here to stay! Back to business! For today I prepared a simple, yet…
Ever wanted to have a nice click effect on your buttons? Today we're going to create one called: The Ripple Effect. See the demo below: demo HTML: A simple button will do... You could also add a class if you need, but it's not required if you want to…
In the previous post we built an animated hamburger button, but we didn't have something to show (like a menu) when the button was pressed. In this post we'll build a responsive navigation menu which will show/hide when the button is pressed. This is…
Today we're going to create, from scratch, the hamburger button. Big CSS frameworks like Bootstrap and Foundation use this into their own products. We are also going to add a little CSS animation to make it look more "fancy". :D Note: in this…
Sometimes when the user interacts with your application, behind the scenes you might need to send back some data from the server. It's a good idea to have some sort of loading animation which ensures the user that you're processing his input, and…
In this article we're going to create a simple progress bar which will act as an indicator on how much a user scrolled on the website. It can be very useful for a blog or any kind of website where you might have some extra text. This way the readers…
In this post we're going to take a look on how to achieve the Floating Label animation with pure CSS. It's been used in MaterializeCSS and it's a clever way to improve the look and feel of your input fields. Read more about it here. The final result…
Have you ever wanted to change the default look and feel of your checkboxes? To be honest, it looks a little odd on a modern website. Today I'm going to show you 3 different ways you can customize your checkboxes with CSS3. No JavaScript required…
This is a very special day for me. I'm so glad that I finally managed to launch my blog. I've been thinking about doing it for the past year, and it's finally here! :D It's been a fantastic journey as I chose to build the entire blogging CMS from the…