DEV Community: {Amogh Dixit}

React Virtual DOM

{Amogh Dixit} — Wed, 02 Sep 2020 13:54:26 +0000

If you are working with React or have ever used React in your projects, you might have come across the term React Virtual DOM quite often. In this blog, I'll talk a bit about what Virtual DOM is and why did developers at Facebook employ such a concept while creating React. I'll try to keep it as precise and concise as possible :)

What is DOM?

Document Object Model or DOM is a tree structure of various elements. It's an API for HTML and XML documents and defines the way a document is accessed and manipulated. Everytime there is a change in the state of your application UI, the DOM gets updated to represent that change. However, frequently manipulating the DOM affects performance since it has to continuously re-rendered to update the application, making it slow. This slowness is made worse by the fact that most JS frameworks update the DOM much more than they actually should.

Enter React, the virtual DOM

To address the above issue, React popularized something called the Virtual DOM. The virtual DOM is only a virtual representation of the actual DOM. For every DOM object, there is a corresponding Virtual DOM object. Everytime the state of our application changes, the virtual DOM gets updated instead of the real DOM. A virtual DOM object has the same properties as the real DOM object, although it lacks the ability to directly change what's displayed on the screen. Also, manipulating virtual DOM is much faster than manipulating the real DOM.

How is virtual DOM faster?🤔

When virtual DOM gets updated, React compares it with a virtual DOM snapshot that was taken right before the update. It then compares the new virtual DOM with the previous virtual DOM and figures out which objects have changed. This is called diffing. Once React knows which virtual DOM objects have changed, it updates only those objects on the real DOM and other elements don't get updated as opposed to what the real DOM normally does. This is how virtual DOM works behind the scenes, making it much faster!

If you found this insightful, share it with others as well!

GitHub: A social networking site for programmers

{Amogh Dixit} — Thu, 23 Jul 2020 14:33:01 +0000

"What Gmail is to email, GitHub is to writing software."

This blog is about my experiences and my views on GitHub. It doesn't talk about the various features it offers and how things work on GitHub. Maybe I'll write a separate blog for that :)

I remember coming across this name, 'Github' in the beginning of first year of my engineering. I was attending a workshop conducted by some of my seniors which was mostly based on what GitHub is and how is it helpful for any programmer in today's world.

So what exactly is GitHub?
There’s a follower-following count in GitHub but it’s not Instagram. A sidebar shows who is trending but it’s not Twitter. One can use emojis to display current status but it’s not WhatsApp. It has several elements of a popular social media platform, but it is not one. If I were to give the best, brief description of GitHub, I'd say that Github is a platform where programmers maintain their projects and meet other developers with similar interests and passion. It's a platform used by around 50 million software developers to host their coding projects, most of them open-source — meaning others can access their codes and modify them to create better versions if they feel like.

What YouTube is to content creators or Instagram is to influencers, GitHub is to developers around the world. It is here that they find validation and a means to express themselves in the language(s) they know best — Java, Python, C, Ruby,… you get the drift.

The platform allows developers to collaborate with fellow developers from around the world. For a community that stays isolated from the mainstream world and never gets its moment under the sun,

GitHub is where developers find their place to discuss, enhance, learn and collaborate with people who essentially understand who they are and what they do. It hosts a community which was a long time coming and still has a long way to go!

One thing I like the most about GitHub is that there's no room for gender bias. It's a very wholesome community with like-minded people. It's not like any other social media platform where women are targeted and mocked for doing something people might not approve of. I personally knew some amazing #WomenWhoCode before joining Github and it's amazing how it has helped me widen my network even further.

I've started looking at code differently ever since I've joined GitHub. I used to freak out on seeing any popular repositories and the code that resided within them. With time, it has only helped me to analyse the code in a better way and understand the gist of the project.

I could go on and on talking about how GitHub has changed my life as a developer. Let me know about your views and experiences in the comments section 😄

Illustrations for Websites

{Amogh Dixit} — Mon, 13 Jul 2020 11:20:16 +0000

Hey everyone!
Could you please suggest me some websites where I can find illustrations to add in my website?

Using R file in html

{Amogh Dixit} — Sun, 12 Jul 2020 11:54:55 +0000

I want to use an R file as a part of my website.I am finding it hard to do the same. Please help me figure it out.

Fonts for websites?

{Amogh Dixit} — Sat, 11 Jul 2020 04:15:07 +0000

Hey everyone! Could you please help me with some good font-families, I really find it hard everytime to find a good font apart from sans-serif.

How did I start as a Web Developer

{Amogh Dixit} — Wed, 08 Jul 2020 19:58:26 +0000

I remember coming across web development for the very first time in the first year of my college. My seniors had organised a workshop for us to introduce us to the world of web development. I was so intrigued by the workshop that I couldn't control my urge to know a bit more about it. I came back to my hotel and immediately started surfing about web development, what it meant, how one is supposed to begin, what are the perks of being a web developer and ofc, how much does a web developer earn :P

As I kept exploring more about it , I realized that this was something I wanna know more about and is worth giving a shot. My excitement was doubled after my seniors announced a Hackathon where we were supposed to design a frontend UI for our college super market accompanied by some database technologies. I knew at that very moment that I wanted to be a part of this. This is how my journey into web development began. Ever since then, it has only gotten even more interesting and fun. I wake up everyday hoping to learn something new and cool and end up making something amazing by the end of the day. Web development has actually become a part of my life. I can't imagine what I would do if it weren't for this newly-found love for web development.

It didn't end here. After the Hackathon, I was sure about one thing, I wanted to delve deeper into this field. But I was clueless about how should I start. Then I came across an article which had a structured roadmap with all the relevant resources available. I started learning basic HTML and CSS from w3Schools and I would recommend it to everybody who's set to start web development. It has a well structured content with sufficient examples. It took about a month for me to master HTML and cover the basics of CSS. It was then that I came to know about a very popular website named FreeCodeCamp. This website is undoubtedly one of the best online resource you could find for web development. It has everything a beginner could ask for. Right from the basics of HTML to extreme features of ES6 version of EcmaScript, it literally has everything! I spent about a month more working with that website and once I had finished, I could see myself design a website on my own and it takes a while for this achievement to sink in :)

Since then, I've come a long way in frontend development, having learnt responsive web design, some popular CSS frameworks like MaterialUI and Bootstrap and I am currently exploring Reactjs.

During this journey, I've learnt a lot.
Web development gives you the opportunity to express yourself creatively on the internet. If you have an idea you would like to try as you discover your web dev skills, try it out. Web dev is a fun, creative experience.You can make texts appear or disappear, create a clickable button and even drag pictures wherever you want on the screen. It all depends on however you want software or a website to work.In my opinion, every programming enthusiast should try web development atleast once :)