Everything is a ToDo list.

Hi Everyone!

Today’s topic might not be clear from the heading, so let me make it clear over here. This post is a bit different so brace your self to think a bit.

In the field of programming, it is very important to understand the fundamentals and core concepts of programming. This field requires you to think differently.

Most people find coding quite tough and the reason being the way they think about web-applications. Anyone can learn the syntax of a computer language, and print ‘Hello World’.

But to literally build something you got to Think Differently…

And that’s what we are going to do today. Don’t go to the different purposes of these web-applications, instead try to see the common pattern that I am trying to point out.

Everything is a todo list.

Every web-application is a kind of todo list app. Let us see how.

ToDo List app:

The picture below is from a todo list web app.

Enter your task to be done and it will add it to the list.

Google is a kind of ToDo List app:

Google is a kind of todo list app, instead of tasks in the list there are the search results.

Enter your query and it gives you the list of search results.

E-commerce(Amazon) shopping cart:

A shopping cart is also a kind of todo list app. Instead of tasks, there are products and items on the list that you saved.

Select your product and it will be added to the list of the cart.

In fact, messaging apps are a kind of ToDo list.

All messaging apps are also a kind of todo list. the only difference is that the text input bar is at the bottom.

See the first image of todo list app, I am about to convert it to a messaging app. Here we go.

conclusion:

Every web-application is a kind of todo list app. Very rarely you would found an application that does not fits into this pattern.

Once again (Don’t consider the functionality of these sites, instead try to see the pattern, I am trying to point out.)

Hence,

A todo list app is a great place to start for beginners.  Walk your way through an advance todo list app (like the one shown in the image above.) to get familiar with concepts used in almost all web applications.

Amazing new articles are about to come, stay tuned!

Thank You.

The most difficult CS subjects.

Hi Everyone!

Let’s talk about the most difficult CS subjects and why these subjects are considered difficult.

These are the subjects that really need an astonishing amount of hard work to excel and master them.

So, without any further due, let’s just dive into this.

The hardest CS subjects:

1.ARTIFICIAL INTELLIGENCE: Giving consciousness to machines, and making them able to take their own decision. This is the most difficult subject in the industry because here you have to be a multi-talented person.

  • Your mathematics needs to be strong enough.
  • You should know how to handle the database.
  • You should be able to develop your own algorithms.
  • Offcource, you need to know how to code.

And the thing that makes AI even more difficult is that it isn’t static, the system by itself gets better and better. Hence to be in the game you have to keep improving yourself.

IT is said about AI that:

“You can initiate it, but you can’t stop it.”

2.THEORY OF COMPUTATION: You might not have heard of it ever. You gave a command to the computer to do ‘X’ and it did. But have you ever imagined how the computer did it – well that’s what is Theory of computation.

The study of that process by which a computer implements a command is called Theory of computation.

Here the expert never asks ‘What?’,  instead, they only ask ‘How?’

They don’t care WHAT the result is, but HOW that result came into existence.

3.MICROPROCESSORS / LOGICAL CHIPS: Those small computers and chips that can do processing for you. This is what you have in all your electronic devices including your smartphones.

It is a big deal to program these processors.

4. ADVANCE DATABASE: You know this, the management and storing of data in a systematic way. It is easy to store data when it is in small quantity. But when it becomes huge it becomes a nightmare to store and maintain it.

It is an art to store and manage a huge amount of data.

5. COMPILER DESIGN: Converting high-level language into machine language. A very rough way to understand it is this:

This is all about creating a software that makes other software.

SO, these were the most difficult subjects of computer science. If you mastered these subjects you can get a huge payoff.

If you liked it then stay tuned for more such articles, and you can also check our previous articles.

Thank You.

Avoid these bad coding habits.

Hello Everyone!

When it comes to coding, most people think it is something mystical that only geeks can understand. Believe me, it is not like that my friend. Anyone can code with a fair amount of practice.

There is nothing mystical about it.

Coding is a skill like any other. Like language learning, there’s grammar and vocabulary to acquire. Like math, there are processes to work through specific types of problems. Like all kinds of craftsmanship and art-making, there are techniques and tools and best practices that people have developed over time, specialized to different tasks, that you’re free to use or modify or discard.

Here we are about to see a few bad coding habits that you must avoid.

Avoid these bad coding practices:

1. Saying “I’ll fix it later”.

The habit of postponing code fixes is not merely a problem of priorities. Organizing your issue tracker might generate some progress, but you also need to have a way of tracking smaller issues that come up. Adding “TODO” comments is a quick way of making sure you don’t miss anything.

2. Insisting on a one-liner solution

Being obsessive about writing efficient, elegant pieces of code is a common trait of programmers. It’s like solving a puzzle—you find a combination of functions and regular expressions that turn 20 code lines into 2 or 3. Unfortunately, it doesn’t always result in readable code, and that’s generally the far more important outcome. Make your code accessible first, then clever.

3. Difficulty seeing through recursion

The idea of recursion is easy enough to understand, but programmers often have problems imagining the result of a recursive operation in their minds, or how a complex result can be computed with a simple function. This makes it harder to design a recursive function because you have trouble picturing “where you are” when you come to writing the test for the base condition or the parameters for the recursive call.

4. your code is a mess

Symptoms
  1. Doesn’t follow a consistent naming convention.
  2. Doesn’t use indentation, or uses inconsistent indentation.
  3. Doesn’t make use of whitespace elsewhere, such as between methods (or expressions).
  4. Large chunks of code are left commented-out.
Programmers in a hurry commit all these crimes and come back to clean it up later, but a bad programmer is just sloppy. Sometimes it helps to use an IDE that can fix indentation and whitespace with a shortcut key, but there are programmers who can even bludgeon Visual Studio’s insistence on proper indentation by messing around with the code too much.

5.Reinventing the wheel all the time

Don’t write code you don’t need to. Perhaps someone else has spent a good deal of time on your problem already, and he or she might have a well-tested solution that you can reuse. Save yourself some trouble.

Conclusion.

As the old saying goes, “If it walks like a duck and quacks like a duck, it’s probably a duck.” The same is true for bad code. If it looks like bad code and smells like bad code, it’s probably bad code. The infallible developer does not exist. The almighty developers that came before may have made a mistake, and you will too. It is how coding works.
So, this is it for this article. We will surely talk about good coding habits and practices in upcoming articles.
Thank You.

JavaScript debugging dev tools.

Errors can and will happen every time you write some new computer code.

Programming code might contain syntax errors or logical errors. Many of these errors are difficult to diagnose.

Often, when programming code contains errors, nothing will happen. There are no error messages, and you will get no indications where to search for errors.

Searching for (and fixing) errors in programming code is called code debugging. And believe me, that’s not easy but the most valuable skill a developer could have.

Hence, here I am with top JavaScript debugging tools.

Chrome DevTools:

chrome dev tools

Google Chrome DevTools is a set of debugging tools that can be used to debug JavaScript code right from the Chrome browser as they are inbuilt. You can get to interact with HTML, CSS and JavaScript all from the browser simply by clicking the inspect element button.

It has the resources panel for inspecting the storage of web pages such as the HTML5 database, cookies, local storage etc.

You may have been using Chrome all these years without knowing that it has a debugging tool with so much power.

Sublime Web Inspector:

SublimewebinspectorThe sublime web inspector is a javascript debugging tools. The sublime web inspector allows you to debug, whatever you edit in your programs. It works on top of Web Inspector Protocol.

If you use Sublime Text Editor for your JavaScript editing, then Sublime Web Inspector allows you to debug from the same program you edit with. It works on top of WebInspectorProtocol, with all information displayed in console and text files.

Node.js Inspector for Debugging Requests to Node Apps

Debugging the Node.js on your application’s backend can be challenging. The following tools take advantage of the capabilities of the Node.js Inspector to assist you:

 

React Developer Tools

IN THE BROWSER: The React tab shows props and state values if they exist for the selected elements.So, these were the four debugger tools that can make debugging easier for you. You can learn to use them through the tutorials available online for free. Hope you liked the article.

Thank You.

Plunker and Angular JS.

Hi Everyone!

Let’s talk about Plunker, what is it and how is it related to Angular JS.

Plunker is an online community for creating, collaborating on and sharing your web development ideas. Plunker is the best tool to prototype, experiment, share and debug your ideas on the web platform. From idea to implementation, Plunker helps you build the web.

This is what they say in technical terms, let me clarify this.

Plunker:

Plunker or plnkr is an integrated web development environment and is completely written in AngularJS. The plunker website also provides you to write plunks(codes) and share it with other developers.

There is also the ability to search for popular JavaScript library and refer it to your current plunk. Another feature is the live preview which is quite handy when you are learning AngularJS as you can see the result of your code change in real-time.

Some of the other features are the ability to do real-time collaboration on Plunker and I recommend that if you are going to do any serious AngularJS development then try Plunker first.

A really handy feature is that you can use almost any framework right from the editor, without any complex setup.

We can code up Angular in the browser using plunker. It gives us the ability to try our Angular quickly without requiring complex setup.

It also gives us a unique URL so:

  1. We can quickly take a look at some code another person has written.
  2. We can share our code with other people, which is especially useful when we are stuck with some broken code and need help.

Why do most Angular JS people prefer Plunker?

The material reason is that Plunker allows creating an arbitrary number of files, while JSFiddle (or JSBin, for that matter) restrict you to one HTML + one CSS + one JS. Plunker also allows downloading the project as a ZIP.

Plunker allows you to describe a larger example of functional Angular.js code than JSFiddle.  It also gives better feedback and real-time previews as you type.

JSFiddle, on the other hand, allows you to quickly share a single example of some functional code, mainly a jQuery snippet of some sort.

Both are great platforms and have contributed so much to the community.

So, I hope that you liked this post and got some useful information. Stay tuned for more such contents.

Thank You.

Developer v/s Hacker v/s Programmer v/s Computer Scientist.

Hello Everyone!

This is going to be very interesting.

In this article, I will talk about Hackers, Programmers, Developers, and Computer Scientists. The level of their knowledge and expertise. I will try to keep it simple while explaining their roles in the industry and how they are different from each other and plays a different role.

We will also try to figure out who is more suitable for what job.

With this article, I am not judging any profession, because I understand very well that every profession has its own importance in the industry. The entire industry will collapse if even one of them vanishes.

So, without any further due, Let’s begin.

Computer Scientist.

A Computer scientist is the one who experiments with different computer languages. They know everything from the binary (bit 0,1,0,1) to all the way to software and hardware.

Understanding the Algorithm and Data structures. These people are often very good at Mathematics. Without any doubt, a computer scientist is at the top.

Yet! They are not directly involved in the industry that much. The reason being their extreme knowledge. Yes, you heard it right. They are mostly focused on solving big problems.

A computer scientist is the one who develops or invents new programming languages.

For instance, Tim-Berner-Lee is a very well known Computer Scientist. You can check about his latest project Here. Thanks, him if you are using the World Wide Web (www).

Programmer.

A programmer is the one who understands a pre-written programming language and uses it to write a program for machines or computer to say.

They understand almost all the programming languages that exist in their era. They never stop learning.

They write programs on which different software runs.

A programmer may be working on different languages at a time, while the work of a computer scientist is very specialized.

Developer.

A Developer is surely the most sought and in-demand professional in the industry.

They understand and masters a particular computer language. While as mentioned earlier a programmer can be working with almost all existing languages at a time.

They possess a very specialized knowledge.

For example:

  • Android developer
  • IOS developer
  • Web developer

Hacker.

A Hacker is the one who works in an emergency scenario. Knowledge level of a hacker depends on individuals.

Their knowledge is not syllabus based.

Basically, they find bugs in the system and hacks it (with the owner’s permission). Just tries to enter the system anyhow.

Sometimes a hacker could be as good as a developer or a programmer.

Kinds of hackers:

  • Ethical hacker (White hat hacker)
  • Unethical hacker (Black hat hacker) – Illegal

Quick summary:

  • Computer Scientist – Research-based specialized work, inventing new languages.
  • Programmer – Knows and understands many languages and writes code for software and machines.
  • Developer – Specialized knowledge, master in a particular language.
  • Hacker – Works in the emergency case to save the data and system.

So,  that is it for this article. Once again I will say – I am not judging any profession.

Feel free to comment below.

Thank You.

FrameWorks and their pros and cons.

Hello Everyone!

Let’s talk about Frameworks. Today we are going to look at some pros and cons of using a framework.

Before that let’s have a quick explanation of Frameworks.

What is a FrameWOrk?

In computer programming, a software framework is an abstraction in which software providing generic functionality can be selectively changed by additional user-written code, thus providing application-specific software.

A framework is a set of pre-written programming code that anyone can use to save their time and energy. Different programming languages have different frameworks. Often the framework is also referred to as coding libraries.

Libraries are a bunch of codes that can save your time by already implementing the functionality you want.

Types of Frameworks:

  • UI/CSS Framework: Bootstrap, Materialize, Bulma, etc.
  • Frontend JS Framework: React, Vue, Angular, etc.
  • Backend Framework: Laravel, Express, Django, etc.

UI Framework:

Pros:

  • Faster development and prototyping.
  • Responsive by default.
  • Browser compatibility.
  • Documentation and support.
  • JavaScript widgets/plugins.

cons:

  • Stops developers from learning CSS.
  • Less Customization.
  • Lots of overriding styles.
  • Many sites look the same.
  • Many depend on JQuery for certain things.

Frontend JS Framework:

Pros:

  • Much less work for large frontend application.
  • Organized, component-based design.
  • Robust data/state management.
  • Virtual DOM (Fast performance).
  • Reliable and tested.
  • Great for teams.

cons:

  • Adds complexity for simple projects.
  • Can be too opinionated / less freedom.
  • Stops beginners from learning actual JS coding.
  • Updates can introduce issues.

Backend Framework:

Pros:

  • Saves a ton of time and makes things much easier.
  • Very flexible and allow you to build anything.
  • Built-in Security.
  • MVC (Modal view controller).
  • Built-in routing.
  •  Community documentation and support.

cons:

  • Can stop beginners from learning the fundamentals of coding.
  • Less Freedom.
  • That’s all I got.

Conclusion:

So, in the end, it literally comes down to the individual developers and programmers choice. Definitely, Framework is an amazing tool, but you should also be able to work without them.

That is it from my side for this article. Stay tuned for more such contents.

Thank You.

5 WP plugins every developer must have.

Hello everyone!

If you’re a web developer working with WordPress, read on to get five great plug-ins that can help in every aspect of the development process.

WordPress plugins for developers are rated highly by developers since they help make their work easier. I have researched and found these 5 WordPress plugins that stand out as the most useful plugins for developers.

While there is no scarcity of WordPress plugins in the world, I want to showcase some of the plugins that I think you code junkies out there may get some use out of and up your game.

So, let’s begin.

5 WP plugins for developers:

  • User Switching10 Best WordPress Plugins for DevelopersUser switching can be described as a developer’s best time saver. Ever wondered how to quickly login and log out from your WordPress site in order to view how other viewers see your website? You don’t have to keep logging in and out of your site, you can now use this plugin to switch between different users, saving you a great deal of time. This plugin allows you to switch between registered users without having to login in and out. With a click on a button, you can easily and quickly switch WordPress users.
  • Query Monitor query monster plugin for wordpress developers
    Query Monitor lets you view all the ongoing database queries, as well as the rows being affected. You can also view rewrite rules, hooks fired on the current request, PHP errors and warning and even template filenames and parts. Furthermore, Query Monitor is one of the very few WordPress plugins for developers that let you keep track of AJAX calls, REST API requests and redirects. So if you are working with the WP REST API plugin, Query Monitor can prove to be very useful.

     

  • Debug BarBest WordPress Plugins for Developers

    Put simply, Debug Bar helps you debug your WordPress site in the most efficient way. You can check for PHP errors, database errors, and requests, various cache options, too. Plus, the plugin description mentions a lot of add-ons that give you “more insight into, for instance, the registered Post Types, Shortcodes, WP Cron, Language file loading, Actions and Filters and so on.”

  • Developerplugins for developer_9This is the ultimate plugin for testing your WordPress development environment. This plugin checks and ensures that your development environment is configured correctly including the plugins, constants and other settings. This plugin helps developer develop by optimizing their environment and ensuring essential tools and plugins are installed.
  • WordFenceImage titleWeb security is very critical in the tech world nowadays. Cyber breaches may cause harm to the whole organization. As a developer, you need to take care of your website. WordFence will help you shield your web pages by building a firewall and malware scanner. The malware scanner checks core files, themes, and plugins for malware, bad URLs, backdoors, SEO spam, malicious redirects, and code injections.

For more helpful WP plugins, with their detailed review please visit: List of really good and important plugins for WordPress.

I Hope that it was helpful to you. If you want us to touch any topic regarding web development than please let us know in the comments below.

Thank you for reading this far.

The difference b/w Web-Designer and Web-Developer.

“Web Designer” and “Web Developer”.  Oftentimes, the two phrases are used interchangeably by someone who is not familiar with the industry.

The role of each is completely different from the other. But let’s have a look into the different roles and methods, of both a web designer and a web developer.

At present, the boundaries between web designers and web developers are getting blurred. More and more designers began to learn to code, and developers are beginning to pay close attention to design theory. Is a web developer the same as a web designer? This article will tell the difference.

The difference b/w Designer and Developer.

Web-Designer:

Usually, web designers are responsible for the design of the visual layout of websites. Excellent designers are good at the using of a variety of concepts, such as color collocation, typesetting, spatial relations, and user experience.

Web designers use various design programs such as Adobe Photoshop to create the layout and other visual elements of the website.

Through the use of graphic design software and prototyping tools, web designers could create the initial version of a website. Then the completed design will pass to web developers for coding.

Web-Developer:

Web developers are generally considered as a group of people who use the left brain to develop the coding of products. Under normal circumstances, Web developers get the design of the page from the Web designer and then use front-end development technology to encode these pages. They do not really care if the page looks good or not, but they care about the clean code very much. Outstanding developers are always paying more attention to details and focusing on each of them.

Web developers use HTML, CSS, Javascript, PHP, and other programming languages to bring to life the design files.

In recent years, front-end development is a hot-seat and many young people want to become a web developer. Consequently, the skill requirements are getting higher and higher, and of course, the level of web developers’ salary also increased correspondingly. At present, it’s a good time to enter the front-end development industry.

At the end of the day, both web designers and web developers are working toward a singular goal – to create a website or app that entices and attracts users.

Anyone of the two is incomplete without other.

You gave your precious time to read this article.

Thank You.

How to host your web page on Github?

Hello Everyone!

Let’s talk about hosting, once again. I have talked quite a lot about hosting in other articles, but this one is different.

If you want to launch a simple website but don’t want to go through the dull process of setting up yet another hosting package. There is an easier solution. If you just want to launch a simple static website you can use GitHub Pages to host your site for free.

GitHub is not only a great place to store and share your code with others but they also offer free web hosting of your HTML, CSS, and JavaScript projects!

Steps to host your page on GitHub:

  1. Signup for GitHub account: Visit github.com, and you’ll see a signup form on their front page. (If you don’t, congrats, you already have an account!)
  2. Download and install the GitHub desktop app: This is the app that we’ll use to get our code up on GitHub. It’s easy to use so don’t fret; the user interface is easy to learn!
  3. Create a Git repository: Open up the GitHub Desktop app and click the “Create New Repository” button.

    When the “Create a New Repository” dialog window appears, fill in the “Name” text input as:

    [username].github.io

    Name your repository in this manner will tell GitHub to host the files in this project automatically and display them when someone points their browser to:

    https://[username].github.io/

    This will be the web address you will share when your site is ready to publish and go live! Congratulations, you have a new project! But it has no files yet. As a quick way to create the first file, click the “README” link:

  4. Copy your files to the new Repository file: Copy everything in your working folder (/Documents/my-site) into your GitHub Repository folder (/Sites/[username].github.io).
  5. Scroll down the page until you find the Commit area, and click “Commit new file”. Every time you create a new version of a file, you are making a “commit” to record that in the file version history. Each commit has a message to describe the change.
  6. Type YOUR_USERNAME.github.io in the browser, and reload until your webpage appears. Github takes from 1-10 minutes to upload your project changes to the user-facing webpage URL, so you may need to exercise patience. You may also need to “hard reload” (hold shift while reloading), to clear the browser cache.

Whenever you want to make changes to your website, you just need to commit the changes and then push the files up to your GitHub repository. Your changes will be published automatically!

If you want to use your own domain you can do that too. We will talk about it in some other near future article.

Let me know if I missed any steps, if something didn’t work out quite right for you, or if this guide was helpful! Thank you for reading!

Happy Coding.