DEV Community: Yashwanth

Body BackgroundColor change with Date object

Yashwanth — Thu, 25 Jul 2019 20:56:45 +0000

If you want to try out Date object in javascript ,this is a perfect example.

There are differnt methods in date object. I used getHours() method to change the color according to time.
Here is the html code

Here is the code for javascript code

Here is the codepen link if you want play/implement.
If you want to get deeper into Date methods, then have a look at MDN docs.
Post your best use of Date in comments and love to see yours.Hope you like this example.

Good Stuff

How I created my first Vs code Snippet for React ??and boom React Hooks snippet.

Yashwanth — Sun, 14 Jul 2019 09:17:54 +0000

Everyone has special and perhaps, particular, tastes when it comes to their code editor. There are literally hundreds of snippets out there for react, and for good reason: enhancement to productivity for faster code.
Snippets play a handy role in code editors when you want write code repeatedly,it frustrate the things up.

Its one of the things that i wanted to be a publisher in vscode,so I created a extension for react hooks which is handy for react devs and inspired by Live server extension in vscode.

#Fire it up

Before you do anything, you’re going to install vsce (short for Visual Studio Code Extensions) and establish yourself as a publisher. All of the instructions to do so are here. I know it looks like a lot, but it takes anywhere from 5-10 minutes, and then you'll never have to do it again, for any extension you create.

Now that you’ve got that under your belt, here are the steps you need to start work.

First, you need to run:

This makes the generator globally available on your machine (meaning you can now create a snippet in any directory). You can then execute this command to kick off your snippet:

You will be prompted by a screen that looks like this:

When selecting this, it asks if this is a new snippet or if we want to import from an existing one. We want to create a new one.

Next, you'll have to answer a few other questions, including:

What’s the extension's name?
What is the the identifier? (I just went with the name, that’s probably typical.)
What is the the description? (I just put something silly in initially. Don’t worry, you can update this in your package.json in the future.)
What's the publisher's name? (See earlier instructions.)
Language id: 'javascript' (preference which ever u like)

It will set you up with a snippet to start creating your own on snippets.json file. The full scoop and all the details are here.

#Research

Research for a code snippet? Probably! But I was genuinely curious: what would work best for the vast majority of people, while still being something I liked?
So I thought react hooks has been trending then I give it a shot.

Features

Hooks are supported: useState, useEffect, useContext, useCallback,useMemo ,useRef,and useReducer.

1 import useState

Type imrus to "Import React, { useState }"

2 import useEffect

Type imrue to "Import React, { useEffect }"

3 import useContext

Type imruc to "Import React, { useContext }"

4 useState

Type ust to usestate

5 useEffect

Type uef to useEffect

6 useContext

Type uct to useContext

7 useCallback

Type ucb to useCallback

8 useMemo

Type umo to useMemo

9 useReducer

Type urd to useReducer

10 useRef

Type urf to useRef

#Conclusion

If you want to download this extension here is the link and also my github repo link.
Isn't it crazy that you become a vscode publisher instantly in few days.
If you have any doubts regarding code and publishing on Vs code marketplace, here is the link. If you stuck in any place if free to discuss and or else ping me.
Dan abramov is creator of react hooks furtherly check the links for react hooks and making sense of React hooks post on Dev Community.

Thank you for reading

Love Love

Big-O Notation Useful guide

Yashwanth — Mon, 01 Jul 2019 18:27:34 +0000

Two important things to remember while coding are

Readability and
Scalability.

There are many ways to solve a problem but a good developer always strive for better efficeint code and performance.

There comes the Big-O part to scale the time and space complexity of a algorithm/problem.It is helpful in determining the complexity and also scale the performance of algorithm.

Different Big-O terms are

O(1) - Constant time
O(n) - Linear time
O(n^2) - Quadratic time

O(1) - Constant Time complexity

The constant Time complexity explains that no matter what size of the input or output, the execution time and the resources used will always be the same. No matter how many times or where the algorithm is executed, it produces same performance all the time. For example:

O(n): Linear Time Complexity

If an algorithm has linear complexity, then execution time and/or resources used are directly proportional to the input size. For example:

O(n2): Quadratic Time Complexity

The quadratic complexity is present when the impact of the algorithm is directly proportional to the square of the input size.

This complexity is common in sorting algorithms like bubble sort, insertion sort, and the selection sort.

Here are some of Tricky examples
This is a good example, if the function takes two different inputs,so Big-O changes to O(input1 + Input2).

For above example,if it is a nested for Loop then the Big-O changes to O(input1*input2).

Big-O cheatSheet and Graph

Feel free to discuss more tricky examples.
Thank you for reading.