<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Ashish donga</title>
    <description>The latest articles on DEV Community by Ashish donga (@ashishdonga).</description>
    <link>https://dev.to/ashishdonga</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F835849%2Fbe47351e-b007-4ce2-b66f-0946acb72ad3.jpeg</url>
      <title>DEV Community: Ashish donga</title>
      <link>https://dev.to/ashishdonga</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/ashishdonga"/>
    <language>en</language>
    <item>
      <title>error 1452: cannot add or update a child row: a foreign key constraint fails</title>
      <dc:creator>Ashish donga</dc:creator>
      <pubDate>Tue, 18 Apr 2023 11:42:05 +0000</pubDate>
      <link>https://dev.to/ashishdonga/error-1452-cannot-add-or-update-a-child-row-a-foreign-key-constraint-fails-1i03</link>
      <guid>https://dev.to/ashishdonga/error-1452-cannot-add-or-update-a-child-row-a-foreign-key-constraint-fails-1i03</guid>
      <description>&lt;p&gt;The error message "Error 1452: Cannot add or update a child row: a foreign key constraint fails" is a database error that occurs when attempting to insert or update a record in a child table that violates a foreign key constraint with its parent table.&lt;/p&gt;

&lt;p&gt;Foreign keys are used in relational databases to establish relationships between tables, where a column in a child table refers to the primary key of a parent table. This constraint ensures that data in the child table is consistent with the data in the parent table, preventing the creation of orphaned records or inconsistent data.&lt;/p&gt;

&lt;p&gt;This error typically occurs when trying to insert or update a record in the child table with a value that does not exist in the parent table's primary key column. It could also happen when attempting to delete a record from the parent table that is still referenced by records in the child table.&lt;/p&gt;

&lt;p&gt;To resolve this error, you can take the following steps:&lt;/p&gt;

&lt;p&gt;Verify that the values being inserted or updated in the child table's foreign key column exist in the parent table's primary key column.&lt;br&gt;
Check for any inconsistencies in the data between the parent and child tables, such as orphaned records or missing values.&lt;br&gt;
Make sure that any operations on the parent and child tables are performed in the correct order, such as inserting parent records before child records.&lt;br&gt;
If deleting records, ensure that any references to the records being deleted are updated or removed from the child table before attempting to delete the parent records.&lt;br&gt;
Double-check the foreign key constraints and ensure they are defined correctly, with the correct column references and data types.&lt;/p&gt;

&lt;p&gt;If you are still encountering the error after following these steps, it may be necessary to consult with a database administrator or developer for further investigation and resolution.&lt;/p&gt;

</description>
      <category>tutorial</category>
      <category>programming</category>
      <category>database</category>
    </item>
    <item>
      <title>Does Google use ChatGPT data to train Bard ? Does It is true</title>
      <dc:creator>Ashish donga</dc:creator>
      <pubDate>Thu, 30 Mar 2023 15:11:53 +0000</pubDate>
      <link>https://dev.to/ashishdonga/does-google-use-chatgpt-data-to-train-bard-does-it-is-true-19ne</link>
      <guid>https://dev.to/ashishdonga/does-google-use-chatgpt-data-to-train-bard-does-it-is-true-19ne</guid>
      <description>&lt;p&gt;Accusations were made against Google for using ChatGPT data to train its AI chatbot, Bard. However, Google denies these allegations and affirms that it never used any data from ChatGPT. Bard was launched amidst chaos last month with initial criticisms for inaccuracies and a bug during a press conference in Paris. Reports suggest that ChatGPT launch had led to a 'code red' situation at Google offices.&lt;/p&gt;

&lt;p&gt;Recently, The Information reported that Google had trained Bard using ChatGPT data, but the tech giant denied these claims in a statement confirmed by spokesman Chris Pappas. Bard is not trained on any ShareGPT or ChatGPT data. It was reported that Google had obtained the ChatGPT data from ShareGPT website.&lt;/p&gt;

&lt;p&gt;The Information report reported how former Google AI engineer Jacob Devlin resigned to join OpenAI and warned Google not to use the ChatGPT data as it would violate the OpenAI terms of service. A source told The Information that Google had ceased using the ChatGPT data after receiving warnings from the former employee.&lt;/p&gt;

&lt;p&gt;Recently, Google released Bard for public testing, available for select US and UK users who sign up for the waiting list. In an official blog post, Google announced Bard's availability for testing, who is still new to the AI space and expected to make occasional mistakes. A CNBC report revealed that Google CEO Sundar Pichai cautioned employees about possible errors in an email.&lt;/p&gt;

</description>
      <category>chatgpt</category>
      <category>programming</category>
      <category>productivity</category>
    </item>
    <item>
      <title>👨🏻💻 How to code for 8 hours without feeling tired.</title>
      <dc:creator>Ashish donga</dc:creator>
      <pubDate>Sat, 17 Sep 2022 03:40:24 +0000</pubDate>
      <link>https://dev.to/ashishdonga/how-to-code-for-8-hours-without-feeling-tired-56c0</link>
      <guid>https://dev.to/ashishdonga/how-to-code-for-8-hours-without-feeling-tired-56c0</guid>
      <description>&lt;p&gt;🔴 I’ve been coding wrong my whole life.&lt;/p&gt;

&lt;p&gt;I thought it was okay to just sit down at my desk, open my laptop, take a task from my To-Do list, play some music and code until I felt tired.&lt;/p&gt;

&lt;p&gt;But in reality, this style of work always kills my productivity level after 2–4 hours of coding.&lt;/p&gt;

&lt;p&gt;I felt so tired that I did NOT want to do anything except different low energy tasks ( Like Code Review )&lt;/p&gt;

&lt;p&gt;Today I can code 8+ hours without like crap after.&lt;/p&gt;

&lt;p&gt;WHAT HAS CHANGED 🤔? YOU MAY ASK ME.&lt;/p&gt;

&lt;p&gt;THE ANSWER? MY APPROACH TO WORK 🛵&lt;/p&gt;

&lt;p&gt;Over time, I’ve created a productivity system 🪐 that helps me to code, write, create and live at my maximum capabilities without getting bored, tired, or burnt out.&lt;/p&gt;

&lt;p&gt;My productivity system stays on 3 main pillars:&lt;/p&gt;

&lt;p&gt;Schedule&lt;br&gt;
TO-DO for tomorrow&lt;br&gt;
System 69!&lt;br&gt;
Let’s look closer at each of them&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;📆 Schedule&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Everything starts with a schedule. What, where, and when I do.&lt;/p&gt;

&lt;p&gt;My schedule looks like this:&lt;/p&gt;

&lt;p&gt;7 AM to 8:30 AM: Meditation, Sport, Shower.&lt;/p&gt;

&lt;p&gt;8:30 AM to 9:00 AM: Breakfast.&lt;/p&gt;

&lt;p&gt;9:00 AM to 12:00 PM: My 3 hours programming time.&lt;/p&gt;

&lt;p&gt;12:00 PM to 1:00 PM: Lunch and go out walking for 15–20 minutes.&lt;/p&gt;

&lt;p&gt;1:00 PM to 6:00/7:00/8:00 PM: My Next hours for coding.&lt;/p&gt;

&lt;p&gt;8:00 to 9:00 PM: Family Time, Watch a movie or something.&lt;/p&gt;

&lt;p&gt;DO NOT FORGET TO SLEEP 8 HOURS A DAY.&lt;br&gt;
YOUR BRAIN NEEDS TO COLLECT THE GARBAGE AND RID OF THEM.&lt;/p&gt;

&lt;p&gt;🗺 To-Do for Tomorrow&lt;/p&gt;

&lt;p&gt;My To-Do list is simple. I use a plain paper notebook to make it and Notion digital copy.&lt;/p&gt;

&lt;p&gt;I create my To-Do list in the evening for tomorrow day.&lt;/p&gt;

&lt;p&gt;I create my To-Do list for tomorrow, and not in the morning because it saves my productivity time and my energy attention.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;🚦Systematic Breaks&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;When I started coding I did it like this:&lt;/p&gt;

&lt;p&gt;Open laptop 👉 Open code editor 👉 Pick a task 👉 code until I feel tired 👉 take a break ( Meditate or walking for 5 minutes / spending time on social media ).&lt;/p&gt;

&lt;p&gt;Yup!&lt;/p&gt;

&lt;p&gt;Until I read about Pomodoro. The Pomodoro Technique is a time management method when you break down work into intervals, traditionally 25 minutes in length, separated by short breaks.&lt;/p&gt;

&lt;p&gt;Do You Code 8 hours a day?&lt;/p&gt;

&lt;p&gt;Read More&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dev.to/ashishdonga/its-2022-please-dont-just-use-consolelog-anymore-2oel"&gt;&lt;strong&gt;It’s 2022, Please Don’t Just Use “console.log” Anymore 😎&lt;/strong&gt;&lt;br&gt;
&lt;/a&gt;&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>beginners</category>
      <category>programming</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>It’s 2023, Please Don’t Just Use “console.log” Anymore 😎</title>
      <dc:creator>Ashish donga</dc:creator>
      <pubDate>Fri, 16 Sep 2022 05:48:45 +0000</pubDate>
      <link>https://dev.to/ashishdonga/its-2022-please-dont-just-use-consolelog-anymore-2oel</link>
      <guid>https://dev.to/ashishdonga/its-2022-please-dont-just-use-consolelog-anymore-2oel</guid>
      <description>&lt;p&gt;It is 2023 and still you use console.log then this guide for you&lt;/p&gt;

&lt;p&gt;5 JavaScript console object methods and tricks you should know about.&lt;/p&gt;

&lt;p&gt;As a front-end engineer, you must have used console.log, which can help us print auxiliary information on the console to troubleshoot problems.&lt;/p&gt;

&lt;p&gt;But do you know any other secrets about the console object?&lt;/p&gt;

&lt;p&gt;This article will introduce 5 practical tips for using the console object, I hope you will like them&lt;/p&gt;

&lt;h2&gt;
  
  
  1. console.log()
&lt;/h2&gt;

&lt;p&gt;1.1 Basic usage skills&lt;/p&gt;

&lt;p&gt;console.log() is the method we use most often in our work, and you can use it anywhere in JavaScript.&lt;/p&gt;

&lt;p&gt;`&lt;br&gt;
const name = 'fatfish'&lt;br&gt;
const age = 24&lt;/p&gt;

&lt;p&gt;console.log(name, age)&lt;br&gt;
`&lt;/p&gt;

&lt;p&gt;But when the amount of printed information becomes very large, the information becomes unintuitive. Because we don’t know what it refers to&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const name = 'fatfish'
const age = 24
const job = 'Front end development engineer'
const hobbies = 'read, write article'

console.log(name, age, job, hobbies)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fa8tk0883sm0jjtcllkeu.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fa8tk0883sm0jjtcllkeu.png" alt="Image description"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;So, is there any good way to see more clearly what it is?&lt;/p&gt;

&lt;p&gt;Yes, we just need an object.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const name = 'fatfish'
const age = 24
const job = 'Front end development engineer'
const hobbies = 'read, write article'

console.log({ name, age, job, hobbies })
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Flx01drra3mvkjmnxlvhd.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Flx01drra3mvkjmnxlvhd.png" alt="Image description"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;1.2 CSS style&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fi0aeidse0mdee8z0dc9j.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fi0aeidse0mdee8z0dc9j.png" alt="Image description"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;It’s so interesting that console.log can also be customized.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;console.log('%cfatfish', 'color: red;')
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  2. console.warn()
&lt;/h2&gt;

&lt;p&gt;When the console prints out a lot of information, it is not easy to find exactly what we want. Don’t worry, console.warn can help us because it has a special yellow colour flag&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;for (let i = 0; i &amp;lt; 50; i++) {
  console.log(`i: ${i}`)

  if (i === 16) {
    console.log(`i--: ${i}`)
  }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpo9jta0rbhkjjn7ymbwb.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpo9jta0rbhkjjn7ymbwb.png" alt="Image description"&gt;&lt;/a&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;for (let i = 0; i &amp;lt; 50; i++) {
  console.log(`i: ${i}`)

  if (i === 16) {
    console.warn(`i--: ${i}`)
  }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fdzy3t40rytuqow1nnb7k.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fdzy3t40rytuqow1nnb7k.png" alt="Image description"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  3. console.error()
&lt;/h2&gt;

&lt;p&gt;In our daily work, we inevitably send HTTP requests to get data, and when an error occurs in the request, I will habitually print an error message via console.log.&lt;/p&gt;

&lt;p&gt;But my friend, believe me, that’s not a good idea. Using console.error would be much more sensible.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;ajax() 
  .then((res) =&amp;gt; {
    fn(res)
  }).catch((err) =&amp;gt; {
    console.error(err)
  })
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Because it not only has a unique red error flag but also prints the stacked relationship of function calls.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const a = () =&amp;gt; {
  console.error("error");
}
const b = () =&amp;gt; {
  a()
}
const c = () =&amp;gt; {
  b()
}

c()
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F6a3dc7hg4d4z6p497xhy.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F6a3dc7hg4d4z6p497xhy.png" alt="Image description"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  4. console.time() &amp;amp; console.timeEnd()
&lt;/h2&gt;

&lt;p&gt;Friends, how do you generally count the execution time of a piece of code?&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let startTime = Date.now()
let count = 0

for (let i = 0; i &amp;lt; 1000000000; i++) {
  count++
}

console.log(Date.now() - startTime)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fh7r2lzxkgu2jyj4anjec.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fh7r2lzxkgu2jyj4anjec.png" alt="Image description"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Maybe you have also gotten the execution time of a piece of code by calculating two-time intervals, but we have a better option, do you want to try it?&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let count = 0

console.time()
for (let i = 0; i &amp;lt; 1000000000; i++) {
  count++
}
console.timeEnd()
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fs1hfh36m6n1e0mcz1r16.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fs1hfh36m6n1e0mcz1r16.png" alt="Image description"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Wow, this is great, I like this way too much. But that’s not enough, if you want to count the execution time of multiple pieces of code, you need to give it a flag.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let count = 0

console.time('time1')

for (let i = 0; i &amp;lt; 1000000000; i++) {
  count++
}

console.timeEnd('time1')

console.time('time2')

for (let i = 0; i &amp;lt; 1000000000; i++) {
  count++
}

console.timeEnd('time2')
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fd6pcm7tz5a040zfcrcb5.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fd6pcm7tz5a040zfcrcb5.png" alt="Image description"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  5. console.table()
&lt;/h2&gt;

&lt;p&gt;We often use console.log to print some information, but sometimes it's not so intuitive.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const foods = [
  {
    name: '🍔',
    price: 30.89,
    group: 1,
  },
  {
    name: '🍨',
    price: 20.71,
    group: 1,
  },
  {
    name: '🍿',
    price: 10.31,
    group: 2,
  },
  {
    name: '🍵',
    price: 5.98,
    group: 2,
  },
]

console.log(foods)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Felv5vb95srpq4wndpdr0.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Felv5vb95srpq4wndpdr0.png" alt="Image description"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Let's try console.table .&lt;/p&gt;

&lt;p&gt;👏🏻 It looks like a table, simple and clear.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fbfr704zzxvs9pitzi2tv.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fbfr704zzxvs9pitzi2tv.png" alt="Image description"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Finally&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Thanks for reading. I am looking forward to your following and reading more high-quality articles.&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Best SEO Practice : How i get 10,000 + per traffic from Google in 1 month😎</title>
      <dc:creator>Ashish donga</dc:creator>
      <pubDate>Thu, 14 Jul 2022 11:51:48 +0000</pubDate>
      <link>https://dev.to/ashishdonga/best-seo-practice-how-i-get-10000-per-traffic-from-google-in-1-month-378e</link>
      <guid>https://dev.to/ashishdonga/best-seo-practice-how-i-get-10000-per-traffic-from-google-in-1-month-378e</guid>
      <description>&lt;p&gt;I have started this general niche blog with my SEO knowledge with mix different language like Hindi, English, Gujarati &lt;/p&gt;

&lt;p&gt;in this blog mainly i have done well keyword research and on-page SEO optimization on that keyword and schema implementation that help me to achieve this result&lt;/p&gt;

&lt;p&gt;this blog is on blogger. Com with custom domain because at that time I have not budget to go with WordPress, but I have experience on WordPress also I have build heaven-overseas.com site on WordPress   &lt;/p&gt;

&lt;p&gt;my main expertise in keyword research, on-page SEO, schema implementation and some off-page SEO trick like forum, profile link building  &lt;/p&gt;

&lt;p&gt;if you have any query or you want guide then dm me at &lt;br&gt;
&lt;a href="https://www.linkedin.com/in/ashish-donga/"&gt;linkedin ashish donga&lt;/a&gt;&lt;/p&gt;

</description>
      <category>seo</category>
      <category>webdev</category>
      <category>tutorial</category>
      <category>saas</category>
    </item>
    <item>
      <title>Simple guide to closures in JavaScript 😎😎</title>
      <dc:creator>Ashish donga</dc:creator>
      <pubDate>Thu, 14 Jul 2022 11:00:31 +0000</pubDate>
      <link>https://dev.to/ashishdonga/simple-guide-to-closures-in-javascript-1opk</link>
      <guid>https://dev.to/ashishdonga/simple-guide-to-closures-in-javascript-1opk</guid>
      <description>&lt;p&gt;Closures are function that are bundled together with the lexical environment within which that function was declared&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const outer = {} =&amp;gt; {
let outervar = "outer";
console.log(outervar);
function inner(){
console.log(outervar,innervar);
}
return inner;
}
outer();
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;the inner function here is a closure why because it enclose or contains the variables from this outer function since it is closure we can use this outside&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let myFunc = outer();
console.log(myFunc);
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;output:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;outer
inner(){
console.log(outervar,innervar);
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  use of closures
&lt;/h2&gt;

&lt;p&gt;1 the for loop dilemma&lt;br&gt;
2 emulating private variables in javascript&lt;br&gt;
3 creation of higher order function&lt;/p&gt;

&lt;h2&gt;
  
  
  some advance use cases of closures
&lt;/h2&gt;

&lt;p&gt;carrying - it is the pattern of functions that immediately evaluate and return other function&lt;/p&gt;

&lt;p&gt;function compositions - function composition is the ability to create functions from another function&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>beginners</category>
      <category>tutorial</category>
      <category>codenewbie</category>
    </item>
    <item>
      <title>Top 7 JavaScript Animation Libraries that you must know 🤓🤓</title>
      <dc:creator>Ashish donga</dc:creator>
      <pubDate>Thu, 12 May 2022 16:50:16 +0000</pubDate>
      <link>https://dev.to/ashishdonga/top-7-javascript-animation-libraries-that-you-must-know-pld</link>
      <guid>https://dev.to/ashishdonga/top-7-javascript-animation-libraries-that-you-must-know-pld</guid>
      <description>&lt;p&gt;Today I will give you suggestion on JavaScript animation libraries&lt;/p&gt;

&lt;p&gt;three.js&lt;/p&gt;

&lt;p&gt;Three.js is a WebGL based 3d animation library. This library allows you to create a scene with a camera and animate objects within it. Three.js is the most popular 3d animation library available for the web&lt;/p&gt;

&lt;p&gt;GSAP&lt;/p&gt;

&lt;p&gt;The gsap library is a great way to create high performance animations that work in all major browsers. It allows you to animate CSS, SVGs and generic objects&lt;/p&gt;

&lt;p&gt;Anime.js&lt;/p&gt;

&lt;p&gt;anime.js a lightweight javascript animation library with a straightforward but powerful api with highly customizable animation effects. it is one of the best all in one animation javascript libraries to use&lt;/p&gt;

&lt;p&gt;Mo.js&lt;/p&gt;

&lt;p&gt;mo.js is a retina ready javascript motion graphics library with simple declarative APIs that will help you master your motion project quickly you don't worry about large file size overheads as it's modular&lt;/p&gt;

&lt;p&gt;Typed.js&lt;/p&gt;

&lt;p&gt;Typed.js is a fantastic typing animation library that includes useful customization features such as bulk typing, smart backspacing and type pausing. you can make any set of strings type out smoothly&lt;/p&gt;

&lt;p&gt;Vivus.js&lt;/p&gt;

&lt;p&gt;vivus.js is a lightweight javascript animation library that is specifically designed for svg drawing animations. you can select from a variety of animation types or write your own custopm scripts&lt;/p&gt;

&lt;p&gt;Proton&lt;/p&gt;

&lt;p&gt;proton is an excellent particle animation library that allows you to quickly create a wide range of particle effects with a variety of renderers you can create flames, fireworks, bullets, and even explosions&lt;/p&gt;

&lt;p&gt;Scroll Reveal&lt;/p&gt;

&lt;p&gt;Scroll revel is a javascript library with no dependencies that you can use to animate your web elements as they scroll into view. Scroll reveal uses the singleton pattern we can call from anywhere&lt;/p&gt;

&lt;p&gt;this is it for today post on JavaScript Animation Libraries&lt;/p&gt;

&lt;p&gt;Read More&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dev.to/ashishdonga/7-killer-javascript-one-liners-you-must-know-nhm"&gt;&lt;strong&gt;7 killer JavaScript one-liners you must know&lt;/strong&gt;&lt;br&gt;
&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dev.to/ashishdonga/12-javascript-pro-snippet-codes-for-everyday-problems-hfn"&gt;&lt;strong&gt;12 javascript pro snippet codes for everyday problems&lt;/strong&gt;&lt;br&gt;
&lt;/a&gt;&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>webdev</category>
      <category>tutorial</category>
      <category>programming</category>
    </item>
    <item>
      <title>7 killer JavaScript One-Liners You Must Know 😎😎</title>
      <dc:creator>Ashish donga</dc:creator>
      <pubDate>Thu, 05 May 2022 13:08:58 +0000</pubDate>
      <link>https://dev.to/ashishdonga/7-killer-javascript-one-liners-you-must-know-nhm</link>
      <guid>https://dev.to/ashishdonga/7-killer-javascript-one-liners-you-must-know-nhm</guid>
      <description>&lt;p&gt;top 7 best killer javascript one liners that you must know in your code journey&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Generate random string&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;if you will ever need a temporary uniques id for something, this is one liner will generate a random string for you&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const randomString = Math.random().toString(36).slice(2);
console.log(randomString)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;extract domain name from an email&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;you can use the substring() method to extract the domain name of the email&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let email = 'admin@ashishdonga.me';
let getDomain = email.substring(email.indexOf('@') + 1);

console.log(getDomain)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;detect dark mode&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;with this one linera you can check if the user is using dark mode and then you can update some functionality according to dark mode&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const isDarkMode = window.matchMedia &amp;amp;&amp;amp; 
window.matchMedia('(prefers-color-scheme:dark)').match;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;*&lt;em&gt;check if an element is focused *&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;to detect if the element has the focus in javascript, you can use the read only javascript property activeElement of the document object&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const elem = document.querySelector('.text-input')
const isFocus = elem = document.activeElement;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Redirecting User&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;you can redirect the user to any specific URL using Javascript&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const redirect = url =&amp;gt; location.href = url
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;check if a variable is an array&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;you can check if any variable is an array or not using the Array.isArray() method&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let fruit = 'apple';
let fruits = ['apple','banana','mango','orange','grapes']

const isArray = (arr) =&amp;gt; Array.isArray(arr)

console.log(isArray.fruit); // false
console.log(isArray.fruits); //true
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;check if an array is empty&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;this is one liner will let you know if an array is empty or not&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let arr1 = []
let arr2 = [2,4,6,8,10]

const arr1IsEmpty = !(Array.isArray(arr1) &amp;amp;&amp;amp; arr1.length &amp;gt;0);
const arr2IsEmpty = !(Array.isArray(arr2) &amp;amp;&amp;amp; arr2.length &amp;gt;0);

console.log(arra1);
console.log(arr2)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;read more&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dev.to/ashishdonga/12-javascript-pro-snippet-codes-for-everyday-problems-hfn"&gt;&lt;strong&gt;12 javascript pro snippet codes for everyday problems&lt;/strong&gt;&lt;br&gt;
&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dev.to/ashishdonga/what-is-difference-between-undefined-null-in-javascript--40gc"&gt;&lt;strong&gt;What is difference between undefined &amp;amp; null in javascript ?&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;share this JavaScript One-Liners article with your friends &lt;/p&gt;

</description>
      <category>javascript</category>
      <category>beginners</category>
      <category>programming</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>12 javascript pro snippet codes for everyday problems😎😎</title>
      <dc:creator>Ashish donga</dc:creator>
      <pubDate>Wed, 04 May 2022 08:27:58 +0000</pubDate>
      <link>https://dev.to/ashishdonga/12-javascript-pro-snippet-codes-for-everyday-problems-hfn</link>
      <guid>https://dev.to/ashishdonga/12-javascript-pro-snippet-codes-for-everyday-problems-hfn</guid>
      <description>&lt;p&gt;level up your javascript skills with these pro snippet codes&lt;/p&gt;

&lt;p&gt;in this post i will share 12 javascript snippet codes for your daily life probelm. it will be your toolbox that you can freely use in your javascript project&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;1. Search Object in Array&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;you can search an object in array using js find() method below is snippet code example&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;// search object in array
let data = [
    {name:"pizza",salary:60000},
    {name:"burger",salary:30000},
    {name:"sweet",salary:20000}
]

let emp = data.find(data =&amp;gt; data.name === 'pizza')
console.log(emp)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;//output
{
    name:"pizza",
    salary:60000
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;2. String Reversing&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;this snippet code will show you how to reverse a string without using a loop&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;var reverse = (data) =&amp;gt; {
    return 
    data.split("").reverse().join("");
}

console.log(reverse('CoderBoy'))
console.log(reverse('Medium'))
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;3. concatenate lists&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;now you don't need to use functions and loops to merge many lists into one. you can use js built in concat() method. check out the below code example.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let arr1 = [10,20,30]
let arr2 = [40,50]
var arr = arr1.concat(arr2)
console.log(arr) // [10,20,30,40,50]
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;4. capture right click&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;this simple snippet code will capture the right click of th mouse on a web browser&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;window.oncontextmenu = () =&amp;gt; {
    console.log("right click i pressed!")
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;5. smart data filteration&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;filter your data with javascript built in filter method this comes in handy when you had a large amount of data in form and want to filter some elements from it&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;var data = ["football","soccer","cricket","basketball","hockey"]
var filterd_data = data.filter(data =&amp;gt; data.length &amp;lt; 8)
console.log(filterd_data)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;6. looping keys and values&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;another useful snippet code to iterate keys and values of dictionary data. we are going to use the forEach method for this task&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let data = { javascript:1, Dart:2, Java:3};
Object.keys(data).forEach((key,values) =&amp;gt; {
    console.log(keys,values)
})

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;//output 
javascript 1
Dart 2
Java 3
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;7. find index of array element&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;now you don't need to iterate the whole array to find an index of any element. make your life easier by taking a loop at the below snippet code&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;var num = [9,8,4,2,8,0,3,8]
num.sort()
console.log(num)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;8. check string is uppercase&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;this is a simple snippet that will help you to check whether a sting is uppercase or lowercase&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const checkUpper = string =&amp;gt; string === string.toUpperCase();
console.log(checkUpper("Hello")) // false
console.log(checkUpper("LEARN")) // true
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;9. built in sorting&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;sorting is a common problem og every programming language. in javascript you can use the sort() method to sort any list of elements&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;var num = [9,8,4,2,8,0,3,8]
num.sort()
console.log(num)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;10. handle errors in js&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;error is always a headache in programming to handle errors in javascript you can use the try/catch statment. checkout the below syntax&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;//error handling
try{
    //code block to try
}
catch{
    //code block to handle error
}
finally{
    //code block to be executed regardless of the try and catch results
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;11. Destructing assignment&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;you can use destructing method to unpack the array values and assign them to other variables. check out the below example code&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let data = ["haider","22","50000","web developer"]
let [name,age,salary,profession] = data
console.log(name,age,salary,profession)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;12. slicing array&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;this is another snippet code that will slice your array without using any loop. the syntax for slice is slice(startIndex,endIndex)&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let array = [10,12,13,14,15,16]
console.array(array.slice(0,3))//[10,12,13]
console.array(array.slice(0,2))//[10,12]
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;a href="https://dev.to/ashishdonga/what-is-difference-between-undefined-null-in-javascript--40gc"&gt;&lt;strong&gt;What is difference between undefined &amp;amp; null in javascript&lt;/strong&gt;&lt;br&gt;
&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dev.to/ashishdonga/top-7-best-algorithms-to-improve-your-javascript-skills-2c2a"&gt;&lt;strong&gt;Top 7 best Algorithms to Improve your JavaScript Skills&lt;/strong&gt;&lt;br&gt;
&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;a href="https://dev.to/ashishdonga/7-killer-javascript-one-liners-you-must-know-nhm"&gt;7 killer JavaScript One-Liners You Must Know&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;final thoughts&lt;/p&gt;

&lt;p&gt;well that is for this 12 javascript pro snippet codes article i hope you find this article helpful and fun to read, feel free to share your valuable response and don't forget to share this article with developer friends happy coding!&lt;/p&gt;

&lt;p&gt;Never stop learning, here is your dose of my programming &lt;strong&gt;&lt;a href="https://www.ashishdonga.me"&gt;ashish donga&lt;/a&gt;&lt;/strong&gt; blog hope you like this leave ur love in comment section&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>beginners</category>
      <category>tutorial</category>
      <category>career</category>
    </item>
    <item>
      <title>What is difference between undefined &amp; null in javascript ? 🚀 🚀</title>
      <dc:creator>Ashish donga</dc:creator>
      <pubDate>Wed, 04 May 2022 06:11:44 +0000</pubDate>
      <link>https://dev.to/ashishdonga/what-is-difference-between-undefined-null-in-javascript--40gc</link>
      <guid>https://dev.to/ashishdonga/what-is-difference-between-undefined-null-in-javascript--40gc</guid>
      <description>&lt;p&gt;before understanding the differences between undefined and null in javascript we must understand the similarities between them&lt;/p&gt;

&lt;p&gt;they belongs to javascript's 7 primitive types&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let primitiveTypes = ['string','number','null','undefined','boolean','symbol','bigint'];
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;they are falsy values values that evaluated to false when converting it to boolean using boolean(value) or !!value&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;console.log(!!null);//logs false
console.log(!!undefined);//logs false
console.log(Boolean(null));//logs false
console.log(Boolean(undefined));//logs false
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;ok, let's talk about the difference between undefined &amp;amp; null&lt;/p&gt;

&lt;p&gt;undefined is the default value of a variable that has not been assigned a specific value. or a function that no explicit return value ex. console.log(1) or property that does not exist in an object. the javascript engine does this for us the assigning of undefined value&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let _thisIsUndefined;

const doNothing = () =&amp;gt; {};

const someObj = {
    a : 'ab',
    b: 'bc',
    c: 'cd'
}

console.log(_thisIsUndefined);//logs undefined
console.log(doNothing);//logs undefined
console.log(someObj['d']);//logs undefined

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;null is "a value that represents no value" null is values that has been explicitly defined to a variavle. in this example we get a value of null when the fs.readFile method does not throw an error&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;fs.readFile('path/to/file',(e,data) =&amp;gt; {
    console.log(e) // it logs null when no error occurred
    if(e){
        console.log(e)
    }
    console.log(data)
})
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;when comparing null and undefiend we get true when using == and false when using ===&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;console.log(null == undefined); //logs true
console.log(null === undefined); //logs false
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;this is it for difference between undefined &amp;amp; null in javascript and stay tuned for more &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;read more&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://www.ashishdonga.me/2022/05/how-to-become-javascript-full-stack-engineer.html"&gt;&lt;strong&gt;how to become javascript full stack engineer&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dev.to/ashishdonga/7-killer-javascript-one-liners-you-must-know-nhm"&gt;&lt;strong&gt;7 killer JavaScript One-Liners You Must Know&lt;/strong&gt;&lt;br&gt;
&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dev.to/ashishdonga/top-7-best-algorithms-to-improve-your-javascript-skills-2c2a"&gt;&lt;strong&gt;Top 7 best Algorithms to Improve your JavaScript Skills&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>beginners</category>
      <category>programming</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>How to deploy your React JS app to AWS at low cost (April 2022)</title>
      <dc:creator>Ashish donga</dc:creator>
      <pubDate>Thu, 28 Apr 2022 04:25:25 +0000</pubDate>
      <link>https://dev.to/ashishdonga/how-to-deploy-your-react-js-app-to-aws-at-low-cost-april-2022-3ga1</link>
      <guid>https://dev.to/ashishdonga/how-to-deploy-your-react-js-app-to-aws-at-low-cost-april-2022-3ga1</guid>
      <description>&lt;p&gt;If you are looking for a way to deploy your ReactJS app to aws at low cost than this guide is best for you&lt;/p&gt;

&lt;p&gt;so let's start with introduction and then simple solution&lt;/p&gt;

&lt;p&gt;I have always had this mental block that I could not deploy anything from the zero. Every place I worked for already had systems running when I joined, so I never had to figure out how to do it. Furthermore, I have never built something on my own, not even as a side project.&lt;/p&gt;

&lt;p&gt;That was until now! 🎉&lt;/p&gt;

&lt;p&gt;Considering I am a person that likes to not spend their money when not needed, I thought that this reacts JS deploy to aws tutorial might help me (and other people) follow this steps in order to get their production website up and running with minimum cost.&lt;/p&gt;

&lt;p&gt;I am going to split into the frontend and the backend part. For the frontend we will use React, AWS S3, AWS CloudFront, AWS Route 53, AWS Certificate Manager, and Google Domain. &lt;/p&gt;

&lt;p&gt;For the backend we will Express, AWS EC2, AWS RDS and NGINX basically.&lt;/p&gt;

&lt;h2&gt;
  
  
  How to deploy react JS frontend to AWS?
&lt;/h2&gt;

&lt;p&gt;For the frontend part, I have just build an app using create-react-app. Simple as that, I built it using Typescript, using tailwindcss and fontawesome. This setup allows you to basically build anything from scratch.&lt;/p&gt;

&lt;p&gt;After you finished the first version of you app, do a npm run build to generate your production version. The files inside the build folder will be the ones you'll upload to AWS S3.&lt;/p&gt;

&lt;p&gt;Next up, do you already have a domain name? It would be nice to get one. For this example I will be using Google Domains. For this project I got the passalong.info.&lt;/p&gt;

&lt;p&gt;Now that we have an idea of our domain, let's create the S3 buckets. We'll create two buckets, one with our "naked" URL, example.com (I will refer to it as first bucket) and another one &lt;a href="http://www.example.com"&gt;www.example.com&lt;/a&gt; (I will refer to this one as second bucket). (On the next project I will test if the second one is really necessary, but let's have those for now).&lt;/p&gt;

&lt;p&gt;You will upload the files from the build folder to the root of the first bucket, do not upload the build folder itself.&lt;/p&gt;

&lt;p&gt;Go for the Permissions tab and turn off the check on Block all public access. Still on the Permissions tab, add the follow bucket policy. Do not change the version, that is fixed.&lt;/p&gt;

&lt;p&gt;Then, go to the Properties tab, under Static website hosting, enable it, then host a static website, and on index document, insert your index file, usually index.html. And save it. After that you should under Static website hosting a URL. Copy that and open in a new tab, it should open your app 🎉 but notice it is showing not secure, no worries, we will fix that later.&lt;/p&gt;

&lt;p&gt;Now onto our second bucket, you will only need to update the Properties tab to redirect to our first bucket. So, under Static website hosting, enable it, but now instead of hosting, you select Redirect requests for an object. On host name you will put the URL copied before without http://, so it would look like example.com.s3-website-us-east-1.amazonaws.com. Do not use the suggested value by AWS. On protocol, select http, we still don't have certificate. Save it. You will see an URL similar to the previous one, if you copy and open in a new tab, you should be redirected to the URL from the first bucket.&lt;/p&gt;

&lt;p&gt;Now let's head over AWS Certificate Manager, we need that along CloudFront to serve our app with https. Request one public certificate, add your fully qualified domain name both with and without &lt;a href="http://www"&gt;www&lt;/a&gt;. Select DNS Validation. After you finished requesting it, it will show as Pending validation, click on your certificate, you will on Domains, a CNAME name and a CNAME value for each domain. Copy those values and head over to Google Domains.&lt;/p&gt;

&lt;p&gt;On Google Domains, under DNS and Default name servers, add Custom Records with those values you obtained from Certificate Manager. Stand up, stretch a little and head back to Certificate Manager, your certificate should be now Issued.&lt;/p&gt;

&lt;p&gt;Great, now let's have our app deployed worldwide with a certificate with cache from CloudFront. Create a distribution, origin domain will be your first bucket, but THIS IS THE IMPORTANT PART, do not select the suggestions, use that same URL you get from your first bucket. You can let the other fields under Origin empty. Under Default cache behavior, set Redirect HTTP to HTTPS, Allowed HTTP methods to all. Under Settings, you can add both your domains to the alternate domain name and you will have to choose the certificate, the one that we created previously. Then create. After it has been deployed, you can see that there is a domain name URL asdqwezxc.cloudfront.net, in order to be sure everything is correct, you can copy that URL and open in a new tab, it should open your app now with https.&lt;/p&gt;

&lt;p&gt;With this CloudFront URL, head over to Google Domains and add with host name &lt;a href="http://www.example.com"&gt;www.example.com&lt;/a&gt;, type CNAME, and value that CloudFront URL.&lt;/p&gt;

&lt;p&gt;Lastly, you need to create a Hosted zone on Route 53, I'm not sure this is still necessary, I'll test on another project as well, since this is the only thing that does not have free tier and costs US$0.50 per month per hosted zone. Create a zone with domain name as example.com and public hosted. After it was created open it and create records. You will have to create a record for each domain. The record type will be A, route traffic to Alias to CloudFront distribution. When selecting the distribution, do not select the suggestions, past the URL we have from CloudFront, routing policy as Simple routing.&lt;/p&gt;

&lt;p&gt;Now you are able to access your app either with www or without but now with the domain you own 🎉.&lt;/p&gt;

&lt;h2&gt;
  
  
  how to deploy reactjs BACKEND at aws?
&lt;/h2&gt;

&lt;p&gt;Looking back up the frontend part took too much information, I'll move the backend to a part 2. Hope to see you there as well.&lt;/p&gt;

&lt;p&gt;if you  enjoy our guide on deploy your React JS app to AWS at low cost then share with your friends&lt;/p&gt;

&lt;p&gt;support me by comment and follow&lt;/p&gt;

&lt;p&gt;read more&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dev.to/ashishdonga/how-to-call-multiple-time-amplify-query-in-react-js-3n30"&gt;&lt;strong&gt;How to call multiple time amplify query in react JS&lt;/strong&gt;&lt;br&gt;
&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dev.to/ashishdonga/top-7-best-algorithms-to-improve-your-javascript-skills-2c2a"&gt;&lt;strong&gt;Top 7 best Algorithms to Improve your JavaScript Skills&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>aws</category>
      <category>programming</category>
      <category>tutorial</category>
      <category>beginners</category>
    </item>
    <item>
      <title>Top 7 best Algorithms to Improve your JavaScript Skills🚀 🚀</title>
      <dc:creator>Ashish donga</dc:creator>
      <pubDate>Wed, 27 Apr 2022 07:37:26 +0000</pubDate>
      <link>https://dev.to/ashishdonga/top-7-best-algorithms-to-improve-your-javascript-skills-2c2a</link>
      <guid>https://dev.to/ashishdonga/top-7-best-algorithms-to-improve-your-javascript-skills-2c2a</guid>
      <description>&lt;p&gt;Today I will teach you top 7 best algorithms to improve your JavaScript skills&lt;/p&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;best Algorithms to Improve JavaScript Skills as programmer&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;so let's start to understand JavaScript algorithms&lt;/p&gt;

&lt;h3&gt;
  
  
  1. how to Find the missing number from the array
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const find_missing = function(input) {
  let n = input.length + 1;
let sum = 0;
  for (let i in input) {
    sum += input[i];
  }
return Math.floor((n * (n + 1)) / 2) - sum;
};
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Input: [1, 2, 3, 4, 6, 7, 8, 9, 10]
Output: 5

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  2. Inverting integers in JavaScript
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const reverse = function(num) {
    let result = 0;
    while (num !== 0) {
      result = result * 10 + num % 10;
      // Math.trunc() 方法会将数字的小数部分去掉，只保留整数部分
      num = Math.trunc(num / 10);
    }
if (result &amp;gt; 2**31 || result &amp;lt; -(2**31)) return 0;
    return result;
};

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Input: num = 123
Output: 321
Input: num = -123
Output: -321
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  3.Array alignment
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const permute = function(nums) {
    let results = [];
let go = (current) =&amp;gt; {
      if (current.length === nums.length){
        results.push(current);
        return;
      }
      nums.forEach(n =&amp;gt; {
        if (!current.includes(n)){
          go([...current, n]);
        }
      });
    }
    go([]);
    return results;
};
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Input: [1,2,3]
Output: [[1,2,3],[1,3,2],[2,1,3],[2,3,1],[3,1,2],[3,2,1]]
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  4.Alignment in strings
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const checkPermutation = function(s1, s2) {
  const len1 = s1.length, len2 = s2.length;
  if (len1 &amp;gt; len2) return false;
const count = Array(26).fill(0);
  for (let i = 0; i &amp;lt; len1; i++) {
      count[s1.charCodeAt(i)-97]++;
      count[s2.charCodeAt(i)-97]--;
  }
  if (!count.some(e =&amp;gt; e !== 0)) return true;
for (let i = len1; i &amp;lt; len2; i++) {
      count[s2.charCodeAt(i)-97]--;
      count[s2.charCodeAt(i-len1)-97]++;
      if (!count.some(e =&amp;gt; e !== 0)) return true;
  }
  return false;
};
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Input: s1 = “ab”, s2 = “eidbao”
Output: true
Input: s1 = “aa”, s2 = “eidbao”
Output: false

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  5.Longest valid brackets
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const longestValidParentheses = function(S) {
  let stack = [-1], ans = 0;
  for (let i = 0; i &amp;lt; S.length; i++)
    if (S[i] === '(') stack.push(i)
    else if (stack.length === 1) stack[0] = i
    else stack.pop(), ans = Math.max(ans, i - stack[stack.length-1])
  return ans
};
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Input: “(()”
Output: 2
Input: “)()())”
Output: 4
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  6.String multiplication
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const multiply = function(num1, num2) {
 if (num1 == 0 || num2 == 0) return ‘0’;
 const result = [];
for (let a = num1.length — 1; a &amp;gt;= 0; a — ) {
 for (let b = num2.length — 1; b &amp;gt;= 0; b — ) {
 const p1 = a + b;
 const p2 = a + b + 1;
 const sum = (result[p2] ?? 0) + num1[a] * num2[b];
result[p1] = (result[p1] ?? 0) + Math.floor(sum / 10);
 result[p2] = sum % 10;
 }
 }
 result[0] == 0 &amp;amp;&amp;amp; result.shift();
 return result.join(‘’);
};
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Input: num1 = “2”, num2 = “3”
Output: “6”
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  4Sum
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const fourSum = function(nums, target) {
  let result = [];
  let length = nums.length;
  if (length &amp;lt; 4) return result; 
  nums = nums.sort((a, b) =&amp;gt; a - b );
for (let i = 0; i &amp;lt; length - 3; i++) {
    if (nums[i] === nums[i - 1]) continue;
    for (let j = i + 1; j &amp;lt; length - 2; j++) {
      if (j &amp;gt; i + 1 &amp;amp;&amp;amp; nums[j] === nums[j - 1]) continue;
let k = j + 1;
      let l = length - 1;
while (k &amp;lt; l) {
        const sum = nums[i] + nums[j] + nums[k] + nums[l];
if (sum === target) {
          result.push([nums[i], nums[j], nums[k], nums[l]])
        }
if (sum &amp;lt;= target) {
          k += 1;
          while (nums[k] === nums[k - 1]) {
            k += 1;
          }
        }
if (sum &amp;gt;= target) {
          l -= 1;
          while (nums[l] === nums[l + 1]) {
            l -= 1;
          }
        }
      }
    }
  }
return result;
};
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;thank you for reading our best Algorithms to Improve your JavaScript Skills guide &lt;/p&gt;

&lt;p&gt;if you have any suggestion than comment &lt;/p&gt;

</description>
      <category>javascript</category>
      <category>beginners</category>
      <category>programming</category>
      <category>productivity</category>
    </item>
  </channel>
</rss>
