<?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: Simc Dev</title>
    <description>The latest articles on DEV Community by Simc Dev (@devsimc).</description>
    <link>https://dev.to/devsimc</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%2F887372%2Fbbbbdaa7-7f00-4d5f-ba80-12dc7079e88e.png</url>
      <title>DEV Community: Simc Dev</title>
      <link>https://dev.to/devsimc</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/devsimc"/>
    <language>en</language>
    <item>
      <title>Useful tools, libraries and resources for developer to speed up the development</title>
      <dc:creator>Simc Dev</dc:creator>
      <pubDate>Mon, 03 Nov 2025 10:45:52 +0000</pubDate>
      <link>https://dev.to/devsimc/useful-tools-libraries-and-resources-for-developer-to-speed-up-the-development-2fjn</link>
      <guid>https://dev.to/devsimc/useful-tools-libraries-and-resources-for-developer-to-speed-up-the-development-2fjn</guid>
      <description>&lt;h3&gt;
  
  
  Javascript libraries
&lt;/h3&gt;

&lt;p&gt;Particles.js — A library for creating beautiful floating particles on a web page&lt;/p&gt;

&lt;p&gt;Three.js — A library for creating 3d objects and spaces on a web page&lt;/p&gt;

&lt;p&gt;Fullpage.js — Easy to implement full page scroll feature&lt;/p&gt;

&lt;p&gt;Typed.js — Typewriter effect&lt;/p&gt;

&lt;p&gt;Waypoints.js — Trigger a function when you scroll to an element&lt;/p&gt;

&lt;p&gt;Highlight.js — Syntax highlighting for the web&lt;/p&gt;

&lt;p&gt;Chart.js — Make beautiful charts using only javascript&lt;/p&gt;

&lt;p&gt;Instantclick — Dramatically speed up your website load time, preloading resources on mouse hover&lt;/p&gt;

&lt;p&gt;Chartist — Another chart library&lt;/p&gt;

&lt;p&gt;Motio — A library for sprite based animations and panning&lt;/p&gt;

&lt;p&gt;Animstion — Jquery plugin for css animated page transitions&lt;/p&gt;

&lt;p&gt;Barba.js — Fluid page transitions&lt;/p&gt;

&lt;p&gt;TwentyTwenty — A visual diff tool to spot differences&lt;/p&gt;

&lt;p&gt;Vivus.js — A library for making drawing animation on SVG&lt;/p&gt;

&lt;p&gt;Wow.js — Reveal animations when you scroll&lt;/p&gt;

&lt;p&gt;Scrolline.js — See how much you have scrolled untill the end of the page&lt;/p&gt;

&lt;p&gt;Velocity.js — Very fast and smooth javascript animations&lt;/p&gt;

&lt;p&gt;Animate on scroll — Pretty straightforward&lt;/p&gt;

&lt;p&gt;Handlebars.js — Javascript templating&lt;/p&gt;

&lt;p&gt;jInvertScroll — Parallax scrolling&lt;/p&gt;

&lt;p&gt;One page scroll — And again a one page scrolling library&lt;/p&gt;

&lt;p&gt;Parallax.js — Parallax Engine that reacts to the orientation of a smart device&lt;/p&gt;

&lt;p&gt;Typeahead.js — Search completion&lt;/p&gt;

&lt;p&gt;Dragdealer.js — Pretty cool dragging library&lt;/p&gt;

&lt;p&gt;Bounce.js — Create cool CSS3 animations&lt;/p&gt;

&lt;p&gt;Pagepiling.js — One page scroll&lt;/p&gt;

&lt;p&gt;Multiscroll.js — Multi scroll a website into two vertical scrolling panels&lt;/p&gt;

&lt;p&gt;Favico.js — Dynamic favicons&lt;/p&gt;

&lt;p&gt;Midnight.js — Switch fixed headers on the fly&lt;/p&gt;

&lt;p&gt;Anime.js — Animation library&lt;/p&gt;

&lt;p&gt;Keycode — Get javascript keycode for a button that is pressed&lt;/p&gt;

&lt;p&gt;Sortable — Drag &amp;amp; drop&lt;/p&gt;

&lt;p&gt;Flexdatalist — Autocomplete&lt;/p&gt;

&lt;p&gt;Slideout.js — Slideout navigation menu for mobile apps&lt;/p&gt;

&lt;p&gt;Jquerymy — Two way data bindings using jquery&lt;/p&gt;

&lt;p&gt;Cleave.js — Format content while typing&lt;/p&gt;

&lt;p&gt;Page — Client side routing for single page applications&lt;/p&gt;

&lt;p&gt;Selectize.js — Hybrid select box for adding tags&lt;/p&gt;

&lt;p&gt;Nice select — Jquery library for creating beautiful select boxes&lt;/p&gt;

&lt;h3&gt;
  
  
  Tether — Efficiently attach absolute positioned elements
&lt;/h3&gt;

&lt;p&gt;Shepherd.js — Guide users through your app&lt;/p&gt;

&lt;p&gt;Tooltip — Name speaks for itself&lt;/p&gt;

&lt;p&gt;Select2 — Jquery replacement for select boxes&lt;/p&gt;

&lt;p&gt;IziToast — Easy to implement js notifications.&lt;/p&gt;

&lt;p&gt;IziModal — Easy to implement js modals&lt;/p&gt;

&lt;h3&gt;
  
  
  CSS libraries / Design stuff
&lt;/h3&gt;

&lt;p&gt;Animate.css — Animation library&lt;/p&gt;

&lt;p&gt;Flat UI Colors — List of simple and effective main colors&lt;/p&gt;

&lt;p&gt;Material design lite — Framework based on Google’s material design&lt;/p&gt;

&lt;p&gt;Materialui.co — Many resources for Material design framework&lt;/p&gt;

&lt;p&gt;Colorrrs — Random color generator&lt;/p&gt;

&lt;p&gt;Section separators — Css section dividers&lt;/p&gt;

&lt;p&gt;Topcoat — Framework&lt;/p&gt;

&lt;p&gt;Create ken burns effect — Ken burns effect using css3 animations&lt;/p&gt;

&lt;p&gt;DynCSS — Add functions to css, to make it dynamic&lt;/p&gt;

&lt;p&gt;Magic animations — Name speaks for itself&lt;/p&gt;

&lt;p&gt;CSSpin — Collection of css spinners&lt;/p&gt;

&lt;p&gt;Feather icons — Icons&lt;/p&gt;

&lt;p&gt;Ion icons — Icons&lt;/p&gt;

&lt;p&gt;Font awesome — Icons&lt;/p&gt;

&lt;p&gt;Font generator — Combine multiple fonts and create a mixture&lt;/p&gt;

&lt;p&gt;On/Off switch — Create on/off switch in css, good for check or radio buttons&lt;/p&gt;

&lt;p&gt;UI Kit — Framework&lt;/p&gt;

&lt;p&gt;Bootstrap — Framework&lt;/p&gt;

&lt;p&gt;Foundation — Framework&lt;/p&gt;

&lt;p&gt;Little Widgets — Html template collection&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>programming</category>
      <category>javascript</category>
      <category>beginners</category>
    </item>
    <item>
      <title>Change your old methods for writing a JavaScript Code - Shorthand's for JavaScript Code</title>
      <dc:creator>Simc Dev</dc:creator>
      <pubDate>Mon, 03 Nov 2025 06:47:20 +0000</pubDate>
      <link>https://dev.to/devsimc/change-your-old-methods-for-writing-a-javascript-code-shorthands-for-javascript-code-534h</link>
      <guid>https://dev.to/devsimc/change-your-old-methods-for-writing-a-javascript-code-shorthands-for-javascript-code-534h</guid>
      <description>&lt;h3&gt;
  
  
  1. Shorthand for if with multiple OR(||) conditions
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;car&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;audi&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt; &lt;span class="o"&gt;||&lt;/span&gt; &lt;span class="nx"&gt;car&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;BMW&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt; &lt;span class="o"&gt;||&lt;/span&gt; &lt;span class="nx"&gt;car&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;Tesla&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="c1"&gt;//code&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In a traditional way, we used to write code in the above pattern. but instead of using multiple OR conditions we can simply use an array and includes. Check out the below example.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;audi&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;BMW&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;Tesla&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;grapes&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;].&lt;/span&gt;&lt;span class="nf"&gt;includes&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;car&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
   &lt;span class="c1"&gt;//code&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  2. Shorthand for if with multiple And(&amp;amp;&amp;amp;) conditions
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;if&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;obj&lt;/span&gt; &lt;span class="o"&gt;&amp;amp;&amp;amp;&lt;/span&gt; &lt;span class="nx"&gt;obj&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;tele&lt;/span&gt; &lt;span class="o"&gt;&amp;amp;&amp;amp;&lt;/span&gt; &lt;span class="nx"&gt;obj&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;tele&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;stdcode&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;obj&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;tele&lt;/span&gt; &lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;stdcode&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Use optional chaining (?.) to replace this snippet.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;obj&lt;/span&gt;&lt;span class="p"&gt;?.&lt;/span&gt;&lt;span class="nx"&gt;tele&lt;/span&gt;&lt;span class="p"&gt;?.&lt;/span&gt;&lt;span class="nx"&gt;stdcode&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  3. Shorthand for checking null, undefined, and empty values of variable
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="o"&gt;!==&lt;/span&gt; &lt;span class="kc"&gt;null&lt;/span&gt; &lt;span class="o"&gt;||&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="o"&gt;!==&lt;/span&gt; &lt;span class="kc"&gt;undefined&lt;/span&gt; &lt;span class="o"&gt;||&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="o"&gt;!==&lt;/span&gt; &lt;span class="dl"&gt;''&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;second&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The simple way to do it is...&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;second&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;name&lt;/span&gt; &lt;span class="o"&gt;||&lt;/span&gt; &lt;span class="dl"&gt;''&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  4. Shorthand for switch case to select from multiple options
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;switch &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;number&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;
     &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;Case one&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;
     &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;Case two&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="nl"&gt;default&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt;
     &lt;span class="k"&gt;return&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Use a map/ object&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;data&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;Case one&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;Case two&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;
&lt;span class="c1"&gt;//Access it using&lt;/span&gt;
&lt;span class="nx"&gt;data&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;num&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  5. Shorthand for functions for single line function
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;example&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;value&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt; &lt;span class="o"&gt;*&lt;/span&gt; &lt;span class="nx"&gt;value&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Use the arrow function&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;example&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;value&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt; &lt;span class="o"&gt;*&lt;/span&gt; &lt;span class="nx"&gt;value&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  6. Shorthand for conditionally calling functions
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;height&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;height&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;width&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;width&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="k"&gt;if&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;type&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;heigth&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nf"&gt;height&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;else&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nf"&gt;width&lt;/span&gt;&lt;span class="p"&gt;();&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Simple way&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;type&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;heigth&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt; &lt;span class="p"&gt;?&lt;/span&gt; &lt;span class="nx"&gt;height&lt;/span&gt; &lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;width&lt;/span&gt;&lt;span class="p"&gt;)()&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  7. Shorthand for To set the default to a variable using if
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;if&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;amount&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="kc"&gt;null&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;amount&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="k"&gt;if&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;value&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="kc"&gt;undefined&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="nx"&gt;value&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;amount&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt; &lt;span class="c1"&gt;//0&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;value&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt; &lt;span class="c1"&gt;//0&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Just Write&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;amount&lt;/span&gt; &lt;span class="o"&gt;||&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt; &lt;span class="c1"&gt;//0&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;value&lt;/span&gt; &lt;span class="o"&gt;||&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt; &lt;span class="c1"&gt;//0&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



</description>
      <category>javascript</category>
      <category>webdev</category>
      <category>programming</category>
      <category>beginners</category>
    </item>
    <item>
      <title>7 Best Visual Studio Code Tricks</title>
      <dc:creator>Simc Dev</dc:creator>
      <pubDate>Tue, 28 Oct 2025 12:44:03 +0000</pubDate>
      <link>https://dev.to/devsimc/7-best-visual-studio-code-tricks-4jk0</link>
      <guid>https://dev.to/devsimc/7-best-visual-studio-code-tricks-4jk0</guid>
      <description>&lt;p&gt;As a developer, he would like to code with VS Code editor. It's one of the most popular code editors. It has lots of advanced features and plugins that you can customize your VS Code. VS Code has the best themes to make your VS Code more beautiful for coding. As a senior developer, he must have to know some of the best VS Code tricks to make coding faster. Here, I've listed some of the best VS Code tricks that make your coding skills faster.&lt;/p&gt;

&lt;p&gt;List of best VS Code Tricks&lt;br&gt;
Select and Rename&lt;br&gt;
Code Snippets&lt;br&gt;
Multi Cursor Selection&lt;br&gt;
Fast Scrolling&lt;br&gt;
Add LogPoints&lt;br&gt;
Select all events of a word &lt;br&gt;
Go to File&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Select and Rename&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;a href="https://media2.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%2Flgnnvpgaftznktmzx9oa.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.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%2Flgnnvpgaftznktmzx9oa.png" alt=" " width="640" height="212"&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;Shortcut Key:: Select + F2

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

&lt;/div&gt;



&lt;p&gt;In VS Code rename the functions and variables is a very irritating thing when you are coding for your project. VS Code has feature finds and replaces that is useful for rename. But F2 is also used for rename.&lt;/p&gt;

&lt;p&gt;When I learned that F2 is a rename command. I used it for the whole project to rename the variable and functions. Simply select the word you want to change, and press F2 and then write the new correct word. It is one of the best tricks for VS Code.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Code Snippets
As a developer, he knows snippets of VS Code for faster coding. When you are working with your project you often create a loop to repeat arrays, then you can create a snippet for it so you never have to type it again. It makes your work easier and faster. You can create snippets for your project and for programming and you can also find them on marketplaces.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;I use snippets for common functions and variables which are repeat again and again. Use &lt;a class="mentioned-user" href="https://dev.to/category"&gt;@category&lt;/a&gt;: "snippets" extension for search-only snippets, you can also define keywords after.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Let's see the basic example:
if error != null {
    return error;
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Here I've listed some snippets&lt;br&gt;
Scope:: It is a comma separator. To enable this snippet you need to use go.&lt;br&gt;
Prefix:: It is one of the snippets.&lt;br&gt;
Body:: You can write your code here.&lt;br&gt;
Description:: A text description that completely understands the logic of coding.&lt;br&gt;
I've also listed some best shortcuts for &lt;a href="https://cmsinstallation.blogspot.com/2021/06/best-vs-code-shortcuts-to-make-your.html" rel="noopener noreferrer"&gt;VS Code to make coding skills faster&lt;/a&gt;.&lt;/p&gt;

</description>
      <category>productivity</category>
      <category>tooling</category>
      <category>vscode</category>
    </item>
    <item>
      <title>7 Free APIs That Nobody Is Talking About</title>
      <dc:creator>Simc Dev</dc:creator>
      <pubDate>Thu, 23 Jan 2025 10:51:02 +0000</pubDate>
      <link>https://dev.to/devsimc/7-free-apis-that-nobody-is-talking-about-cll</link>
      <guid>https://dev.to/devsimc/7-free-apis-that-nobody-is-talking-about-cll</guid>
      <description>&lt;h3&gt;
  
  
  1. Evil Insult Generator
&lt;/h3&gt;

&lt;p&gt;How many times have you tried to insult your best friend? Now you have got a helping hand!&lt;/p&gt;

&lt;p&gt;As the API name suggests, the goal is to offer some of the evilest insults.&lt;/p&gt;

&lt;p&gt;You can create an app centered around this API or combine this API with other excellent APIs provided below like implementing the generated insults in meme templates.&lt;/p&gt;

&lt;p&gt;The API is extremely simple to use. You just need to visit a URL and you get the desired JSON output without even signing up for a key. Those are the Best free APIs.&lt;/p&gt;

&lt;p&gt;Sample output of the API is provided below:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
"number":"117",
"language":"en",
"insult": "Some cause happiness wherever they go; others, whenever they go.",
"created":"2020-11-22 23:00:15",
"shown":"45712",
"createdby":"",
"active":"1",
"comment":"http:\/\/www.mirror.co.uk\/news\/weird-news\/worlds-20-most-bizarre-insults-7171396"
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;You get the other properties as well such as the time it was created, the language, any comment as well as the views. &lt;/p&gt;

&lt;h3&gt;
  
  
  2. Movies and TV API
&lt;/h3&gt;

&lt;p&gt;TMDb is a famous API, but do you know there are other API that provides insights from specific shows and movies?&lt;/p&gt;

&lt;p&gt;Below are some of the APIs you can use to develop apps featuring your favorite show:&lt;br&gt;
Breaking Bad API&lt;br&gt;
API of Ice And Fire &lt;br&gt;
Harry Potter API&lt;br&gt;
YouTube API (for embedding YouTube functionalities)&lt;br&gt;
The Lord of the Rings API&lt;br&gt;&lt;br&gt;
Like the API above, you can get started with some of the APIs without even signing up for a key.&lt;/p&gt;

&lt;p&gt;Not only this, using non-copyright images, you can truly create a great fan app for your beloved shows.&lt;/p&gt;

&lt;p&gt;Below is a sample output from the Breaking Bad API which you can get here which is the Best free APIs.&lt;/p&gt;

&lt;p&gt;It doesn’t require a key however has a rate limit of 10,000 requests per day.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
   [
      {
         "quote_id":1,
         "quote": "I am not in danger, Skyler. I am the danger!",
         "author":"Walter White",
         "series": "Breaking Bad"
      },
      {
         "quote_id":2,
         "quote":"Stay out of my territory.",
         "author":"Walter White",
         "series":"Breaking Bad"
      },
      {
         "quote_id":3,
         "quote":"IFT",
         "author":"Skyler White",
         "series":"Breaking Bad"
      }
      .....
   ]
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;It returns a JSON containing an array of objects with quotes, the author of the quotes, and an ID.&lt;/p&gt;

&lt;p&gt;You can mix these dedicated APIs with YouTube API to create an ultimate app for the fans of these shows.&lt;/p&gt;

&lt;h3&gt;
  
  
  3. Mapbox
&lt;/h3&gt;

&lt;p&gt;Mapbox provides precise location information and fully-fledged tools to developers.&lt;/p&gt;

&lt;p&gt;You get instant access to dynamic, live-updating maps which you can even further customize!&lt;/p&gt;

&lt;p&gt;If you have a project geared towards location and maps, this is a must-know API.&lt;/p&gt;

&lt;p&gt;However, it is worth mentioning that you have to sign up for free to get a unique access token.&lt;/p&gt;

&lt;p&gt;Using this token you can use the amazing services offered by this API.&lt;/p&gt;

&lt;p&gt;Not only this, you can use Mapbox with libraries such as the Leaflet.js library and create beautiful, mobile-friendly maps. So, there is the Best free APIs.&lt;/p&gt;

&lt;p&gt;I have discussed this and much more in my recent article covering the basics of Mapbox and Leaflet.js.&lt;/p&gt;

&lt;h3&gt;
  
  
  4. NASA API
&lt;/h3&gt;

&lt;p&gt;NASA provides a fabulous updated database of space-related information.&lt;/p&gt;

&lt;p&gt;Using this API, one can create mesmerizing and educational apps and websites.&lt;/p&gt;

&lt;p&gt;You get access to various different kinds of data from the Astronomy Picture of the Day all the way to the pictures captured by the Mars Rover.&lt;/p&gt;

&lt;p&gt;You can browse the entire list here.&lt;/p&gt;

&lt;p&gt;You can also retrieve NASA’s patents, software, and technology spinoff descriptions which you can use to build a patent portfolio.&lt;/p&gt;

&lt;p&gt;This API is really diverse and offers a wide variety of data. You can even access the NASA Image and Video library using it. It's the Best free APIs.&lt;/p&gt;

&lt;p&gt;Below is a sample query of the pictures captured by Curiosity on Mars.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
   "photos":[
      {
         "id":102693,
         "sol":1000,
         "camera":{
            "id":20,
            "name":"FHAZ",
            "rover_id":5,
            "full_name":"Front Hazard Avoidance Camera"
         },
         "img_src":"http://mars.jpl.nasa.gov/msl-raw-images/proj/msl/redops/ods/surface/sol/01000/opgs/edr/fcam/FLB_486265257EDR_F0481570FHAZ00323M_.JPG",
         "earth_date":"2015-05-30",
         "rover":{
            "id":5,
            "name":"Curiosity",
            "landing_date":"2012-08-06",
            "launch_date":"2011-11-26",
            "status":"active"
         }
      },
     .....
   ]
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  5. GIF Search
&lt;/h3&gt;

&lt;p&gt;We all love using and creating GIFs but did you know you can incorporate the GIFs in your next app for free using GIPHY?&lt;/p&gt;

&lt;p&gt;GIPHY is the largest GIF and sticker library in the world right now and using their official API you can leverage the vast collection to produce unique apps for free.&lt;/p&gt;

&lt;p&gt;Using the search endpoints, users can get the most relevant GIFs based on their queries.&lt;/p&gt;

&lt;p&gt;You also get access to analytics and other tools which will enable you to create a personalized user experience.&lt;/p&gt;

&lt;p&gt;The most used feature, however, for me was the translate endpoint which converts words and phrases to the perfect GIF or Sticker. You can specify the weirdness level on a scale of 0–10.&lt;/p&gt;

&lt;p&gt;Note that you have to provide proper attribution by displaying “Powered By GIPHY” wherever the API is utilized. These are the Best free APIs.&lt;/p&gt;

&lt;p&gt;Below is a sample output of this API:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
    data: GIF Object[]pagination:
    Pagination Objectmeta:
     Meta Object
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  6. Favourite Quotes API
&lt;/h3&gt;

&lt;p&gt;You can use these quotes to show on the landing page of your website or on the splash screen of your app to produce a rich user experience.&lt;/p&gt;

&lt;p&gt;You also get the ability to create and manage users and sessions via this API. However, there exists a rate limit of 30 requests in a 20-second interval per session. These are the Best free APIs.&lt;/p&gt;

&lt;p&gt;This API also has endpoints to filter, vote, list, update, and delete quotes.&lt;/p&gt;

&lt;p&gt;Below is the output for the Quote of the Day endpoint.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
   "qotd_date":"2020-11-23T00:00:00.000+00:00",
   "quote":{
      "id":29463,
      "dialogue":false,
      "private":false,
      "tags":[
         "great"
      ],
      "url":"https://favqs.com/quotes/walt-whitman/29463-the-great-cit-",
      "favorites_count":1,
      "upvotes_count":2,
      "downvotes_count":0,
      "author":"Walt Whitman",
      "author_permalink":"walt-whitman",
      "body": "The great city is that which has the greatest man or woman: if it is a few ragged huts, it is still the greatest city in the whole world."
   }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  7. Edamam Nutrition and Recipe Analysis API
&lt;/h3&gt;

&lt;p&gt;Edamam generously provides access to a database of over 700,000 food items and 1.7 million+ nutritionally analyzed recipes.&lt;/p&gt;

&lt;p&gt;This API is great if you want to showcase your frontend skills as you can add high-quality pictures of food alongside the recipe of that food provided by this API.&lt;/p&gt;

&lt;p&gt;The free plan can’t be used commercially however it provides a comprehensive set of features such as Natural Language Processing support and 200 recipes per month.&lt;/p&gt;

&lt;p&gt;You can find the full details regarding the different plans offered here.&lt;/p&gt;

&lt;p&gt;The users can simply type the ingredients and get the nutritional analysis which can help them eat smarter and better.&lt;/p&gt;

&lt;p&gt;You can check this cool feature here in the demo of this API. And these are the Best free APIs.&lt;/p&gt;

&lt;p&gt;They have other APIs as well which  can be used in conjunction with the rest to create a one-stop food app.&lt;/p&gt;

&lt;p&gt;They have added a new diet filter specifically geared towards the ongoing pandemic which leverages scientific publications about nutrients and foods to enhance immunity.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>webdev</category>
      <category>beginners</category>
      <category>programming</category>
    </item>
    <item>
      <title>STARTING SAAS ON HRM</title>
      <dc:creator>Simc Dev</dc:creator>
      <pubDate>Fri, 27 Oct 2023 08:13:28 +0000</pubDate>
      <link>https://dev.to/devsimc/starting-saas-on-hrm-3hj</link>
      <guid>https://dev.to/devsimc/starting-saas-on-hrm-3hj</guid>
      <description>&lt;p&gt;Hello &lt;strong&gt;&lt;em&gt;Devs,&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I am really happy to announce that I am starting an new &lt;strong&gt;&lt;em&gt;SAAS business&lt;/em&gt;&lt;/strong&gt; on HRM.&lt;/p&gt;

&lt;p&gt;Basically its an HRM webapp developed using PHP / CodeIgniter.&lt;/p&gt;

&lt;p&gt;It has basic functionality to manage the employees and their related activities.&lt;/p&gt;

&lt;p&gt;Happy Coding To You.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>javascript</category>
      <category>programming</category>
      <category>beginners</category>
    </item>
    <item>
      <title>5 Tips on How To Create The Perfect Freelancer Profile.</title>
      <dc:creator>Simc Dev</dc:creator>
      <pubDate>Tue, 17 Oct 2023 05:34:57 +0000</pubDate>
      <link>https://dev.to/devsimc/5-tips-on-how-to-create-the-perfect-freelancer-profile-53op</link>
      <guid>https://dev.to/devsimc/5-tips-on-how-to-create-the-perfect-freelancer-profile-53op</guid>
      <description>&lt;p&gt;UpWork,  Freelancer.com, People Per Hour, Guru.com, are all great freelance platforms you can use as a starting point for your freelance career. However, just registering an account and filling it up with some random text is not going to work out well for you.&lt;/p&gt;

&lt;p&gt;If you’re serious about making a career as a freelancer, the first thing you need to do is create a complete and attractive freelancer profile.&lt;/p&gt;

&lt;p&gt;So, here’s what you should include in your freelancer profile.&lt;/p&gt;

&lt;h3&gt;
  
  
  1. Use Your Real Name
&lt;/h3&gt;

&lt;p&gt;Even though it’s common sense to use a real name when doing business, a lot of freelancers are still using fake names on their freelancer profiles.&lt;/p&gt;

&lt;h3&gt;
  
  
  2. Upload A Professional Photo
&lt;/h3&gt;

&lt;p&gt;Don’t even think about using a selfie or a really weird close-up webcam photo as your profile picture. That’s a mistake most amateur freelancers make.&lt;/p&gt;

&lt;p&gt;Get cleaned up. Dress well. And ask someone else to take your picture. Make sure not to give too much attention to the background. More importantly, SMILE!&lt;/p&gt;

&lt;h3&gt;
  
  
  3. Craft A Specific Headline
&lt;/h3&gt;

&lt;p&gt;Your headline should describe your job title. So, try to be as specific as possible to make it easier for your client to understand what you do.&lt;br&gt;
No, not like that.&lt;/p&gt;

&lt;p&gt;This is not Twitter. Use a more professional headline&lt;/p&gt;

&lt;p&gt;For example, if you’re skilled in writing eBooks then describe yourself as an “eBook Writer”, instead of just “Writer”. Or “WordPress Plugin Developer”, instead of “Web Developer”.&lt;/p&gt;

&lt;p&gt;Narrow it down to a niche and you’ll have a better chance at getting discovered on a big platform like Upwork.&lt;/p&gt;

&lt;h3&gt;
  
  
  4. Write Your Bio In First-Person
&lt;/h3&gt;

&lt;p&gt;Don’t describe yourself in the third person like you’re narrating a movie and avoid writing your freelancer profile as if it’s a page on a corporate website.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Describe Your Qualifications And Experience
It’s best to include a sentence or two about your qualifications and experience in your bio. But, try not to brag too much. Don’t be like this guy.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Also, use the “Employment History,” “Education,” and the “Other Experiences” sections to add more personality to your profile.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://cmsinstallation.blogspot.com/"&gt;For More such post visit my blog.&lt;/a&gt;&lt;/p&gt;

</description>
      <category>beginners</category>
      <category>webdev</category>
      <category>programming</category>
    </item>
    <item>
      <title>4 Tips to Write Perfect PHP Code</title>
      <dc:creator>Simc Dev</dc:creator>
      <pubDate>Mon, 16 Oct 2023 07:12:35 +0000</pubDate>
      <link>https://dev.to/devsimc/4-tips-to-write-perfect-php-code-inj</link>
      <guid>https://dev.to/devsimc/4-tips-to-write-perfect-php-code-inj</guid>
      <description>&lt;p&gt;&lt;strong&gt;1. Code to interfaces, not implementations&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Interfaces are an indispensable element of well-designed code, although they seem unnecessary for novice programmers.&lt;/p&gt;

&lt;p&gt;When designing an application, an interface allows you to focus on the necessary functionality without going into details.&lt;/p&gt;

&lt;p&gt;Initially, I did not use them because I did not see any use for them. Only relatively recently have I appreciated their gravity in the systems I design.&lt;/p&gt;

&lt;p&gt;The most significant advantage of interfaces is the contract they define. As long as you rely solely on the interface (and don’t mention the implementing classes in any way), you can change the implementation details without affecting your application.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;2. Avoid inheritance&lt;/strong&gt;&lt;br&gt;
This principle is directly related to the recommendation to use the interfaces I described above.&lt;/p&gt;

&lt;p&gt;Inheriting and using abstract classes may seem tempting. We are naturally fit to find and apply patterns. We try to create shortcuts to temporarily facilitate our work.&lt;/p&gt;

&lt;p&gt;However, I know from experience that it ends in problems later on. This is known as technological debt.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;3. Type hint variables&lt;/strong&gt;&lt;br&gt;
Do you use doc-blocks to hint to the IDE about the variable type? If not, I recommend getting started. PHP is an interpretable language, the variable type may change during code execution.&lt;/p&gt;

&lt;p&gt;While the PHP engine may not have problems with the code being executed, your code editor may not know what data the variable contains. Is it a User class object? Or maybe “false” or “null”.&lt;/p&gt;

&lt;p&gt;With this knowledge, your IDE can help you catch simple errors that can happen frequently.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;4. Adopt Command-Query Separation&lt;/strong&gt;&lt;br&gt;
This principle, coined by Bertrand Meyer, is beneficial for building class functions (or methods) or API endpoints.&lt;/p&gt;

&lt;p&gt;Bertrand recommends that the function you create is always a command or a query, but never a command and a query at the same time.&lt;/p&gt;

&lt;p&gt;A command is a function that modifies the state in any way (i.e. deleteUser, removeFile, sendEmail), while the query is a function that returns anything (i.e. findUser, getOwner, findAll, findOneBy).&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>php</category>
      <category>beginners</category>
      <category>programming</category>
    </item>
    <item>
      <title>Where is the reach?</title>
      <dc:creator>Simc Dev</dc:creator>
      <pubDate>Fri, 13 Oct 2023 06:25:41 +0000</pubDate>
      <link>https://dev.to/devsimc/where-is-the-reach-a9f</link>
      <guid>https://dev.to/devsimc/where-is-the-reach-a9f</guid>
      <description>&lt;p&gt;Hello &lt;strong&gt;Guys,&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Hope you guys are doing well!&lt;/p&gt;

&lt;p&gt;I have around 700 followers on devto.&lt;/p&gt;

&lt;p&gt;I just wanted to know why the my posts are not getting proper reach?&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;em&gt;My last 2 posts has only &amp;lt; 25 views.&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I have around _*&lt;em&gt;70,705 *&lt;/em&gt;_views on my 25 posts.&lt;/p&gt;

&lt;p&gt;Please let me know if you have any idea why its like that ?&lt;/p&gt;

&lt;p&gt;Thanks&lt;/p&gt;

</description>
      <category>devto</category>
      <category>webdev</category>
      <category>javascript</category>
      <category>beginners</category>
    </item>
    <item>
      <title>How to Push an empty commit?</title>
      <dc:creator>Simc Dev</dc:creator>
      <pubDate>Fri, 10 Mar 2023 13:30:49 +0000</pubDate>
      <link>https://dev.to/devsimc/how-to-push-an-empty-commit-3jaf</link>
      <guid>https://dev.to/devsimc/how-to-push-an-empty-commit-3jaf</guid>
      <description>&lt;p&gt;Have you ever tried to push a commit to a Git branch without changing any files in order to re-run your integration process? If yes then you are at the right corner.&lt;/p&gt;

&lt;p&gt;Create an empty commit&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;git commit --allow-empty -m “Message”
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Problem&lt;/p&gt;

&lt;p&gt;For continuous integration, we are using AWS CI/CD delivery pipelines which allow us to build, test and deploy applications on a single push to a specific git branch. It helps us to reduce the manual overhead of deploying code to the server and handle all the actions automatically.&lt;/p&gt;

&lt;p&gt;But today I faced a problem where I needed to re-run my delivery pipeline of a branch without adding any extra space or changing any files in the repository, so I searched for the solution for a while and It turns out that Git is allowing us to push an empty commit without adding any staged files to the branch, by using one option --allow-empty during git commit.&lt;/p&gt;

&lt;p&gt;Enough of the problem, let’s jump on to the solution&lt;/p&gt;

&lt;p&gt;Pushing a commit with staged files&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;git add .

git commit -m "changes on app controller"

git push origin master 

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

&lt;/div&gt;



&lt;p&gt;The above commands will add all unstaged files and add commit and push the code to the master branch, after that our delivery pipeline will be started.&lt;/p&gt;

&lt;p&gt;Once the pipeline process fails or you need to run the process again, you will have to push something to the branch but as I mentioned earlier, we will not make any changes to the files, and even then, We will be able to commit the branch with this command.&lt;/p&gt;

&lt;p&gt;Pushing empty commit&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;git commit --allow-empty -m "rerunning the delivery pipeline"

git push origin master 
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;After the above commands, you can see that the commit has been pushed to your branch and the delivery pipeline will be started.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>beginners</category>
      <category>git</category>
      <category>commit</category>
    </item>
    <item>
      <title>How to create API Documentation?</title>
      <dc:creator>Simc Dev</dc:creator>
      <pubDate>Tue, 28 Feb 2023 09:25:58 +0000</pubDate>
      <link>https://dev.to/devsimc/how-to-create-api-documentation-2f5c</link>
      <guid>https://dev.to/devsimc/how-to-create-api-documentation-2f5c</guid>
      <description>&lt;h1&gt;
  
  
  What is API Documentation? A Comprehensive Guide to Understanding APIs
&lt;/h1&gt;

&lt;p&gt;A Beginner's Guide to Understanding APIs and How to Get Started with API Documentation&lt;/p&gt;

&lt;p&gt;Types of API Documentation?&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Reference&lt;/li&gt;
&lt;li&gt;Tutorials&lt;/li&gt;
&lt;li&gt;Conceptual&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  1. Reference
&lt;/h2&gt;

&lt;p&gt;One most basic and useful document is reference. Reference documents provide the information about API structure, parameters, and return value, Developers just loved to spend more time on reference document to understand the API.&lt;/p&gt;

&lt;h2&gt;
  
  
  2. Tutorial
&lt;/h2&gt;

&lt;p&gt;Hand holding documentation, Its provide step by step guide to user, User will get an idea that how to access the API.&lt;/p&gt;

&lt;h2&gt;
  
  
  3. Conceptual
&lt;/h2&gt;

&lt;p&gt;It Provides a high - level idea about how to use APIs to Create new application in any language.&lt;/p&gt;

&lt;h2&gt;
  
  
  How to Write API Documentation: A Step-by-Step Guide
&lt;/h2&gt;

&lt;p&gt;Creating a document of APIs for developer to understand the APIs flow easily,It might be difficult. if you have a good understanding APIs then it will be easy for you to create a any type of API documentation.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://sampledataapi.com/how-to-create-api-documentation.php?devto" rel="noopener noreferrer"&gt;How to create API  documentation&lt;/a&gt;&lt;/p&gt;

</description>
      <category>packaging</category>
    </item>
    <item>
      <title>How to create API Documentation?</title>
      <dc:creator>Simc Dev</dc:creator>
      <pubDate>Fri, 13 Jan 2023 07:33:14 +0000</pubDate>
      <link>https://dev.to/devsimc/how-to-create-api-documentation-jfh</link>
      <guid>https://dev.to/devsimc/how-to-create-api-documentation-jfh</guid>
      <description>&lt;h1&gt;
  
  
  What is API Documentation? A Comprehensive Guide to Understanding APIs
&lt;/h1&gt;

&lt;p&gt;A Beginner's Guide to Understanding APIs and How to Get Started with API Documentation&lt;/p&gt;

&lt;p&gt;Types of API Documentation?&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Reference&lt;/li&gt;
&lt;li&gt;Tutorials&lt;/li&gt;
&lt;li&gt;Conceptual&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  1. Reference
&lt;/h2&gt;

&lt;p&gt;One most basic and useful document is reference. Reference documents provide the information about API structure, parameters, and return value, Developers just loved to spend more time on reference document to understand the API.&lt;/p&gt;

&lt;h2&gt;
  
  
  2. Tutorial
&lt;/h2&gt;

&lt;p&gt;Hand holding documentation, Its provide step by step guide to user, User will get an idea that how to access the API.&lt;/p&gt;

&lt;h2&gt;
  
  
  3. Conceptual
&lt;/h2&gt;

&lt;p&gt;It Provides a high - level idea about how to use APIs to Create new application in any language.&lt;/p&gt;

&lt;h2&gt;
  
  
  How to Write API Documentation: A Step-by-Step Guide
&lt;/h2&gt;

&lt;p&gt;Creating a document of APIs for developer to understand the APIs flow easily,It might be difficult. if you have a good understanding APIs then it will be easy for you to create a any type of API documentation.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://sampledataapi.com/how-to-create-api-documentation.php?devto"&gt;How to create API documentation&lt;/a&gt;&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>beginners</category>
      <category>programming</category>
      <category>api</category>
    </item>
    <item>
      <title>7 Free APIs That Nobody Is Talking About</title>
      <dc:creator>Simc Dev</dc:creator>
      <pubDate>Tue, 10 Jan 2023 06:54:08 +0000</pubDate>
      <link>https://dev.to/devsimc/7-free-apis-that-nobody-is-talking-about-3f1i</link>
      <guid>https://dev.to/devsimc/7-free-apis-that-nobody-is-talking-about-3f1i</guid>
      <description>&lt;h3&gt;
  
  
  1. Sample Data API
&lt;/h3&gt;

&lt;p&gt;Sampledata api The purpose of SampleData is to make it easier for developers to test out APIs, by providing them with ready-to-use samples.&lt;/p&gt;

&lt;p&gt;Sample data is the ultimate source for your web application and API. This is where everything begins, and it’s where you get the bulk of the data your application requires. You simply must have access to a good amount of data before you can start building any meaningful features for your users.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://sampledataapi.com"&gt;Sample Data API&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  2. Evil Insult Generator
&lt;/h3&gt;

&lt;p&gt;How many times have you tried to insult your best friend? Now you have got a helping hand!&lt;/p&gt;

&lt;p&gt;As the API name suggests, the goal is to offer some of the evilest insults.&lt;/p&gt;

&lt;p&gt;You can create an app centered around this API or combine this API with other excellent APIs provided below like implementing the generated insults in meme templates.&lt;/p&gt;

&lt;p&gt;The API is extremely simple to use. You just need to visit a URL and you get the desired JSON output without even signing up for a key. Those are the Best free APIs.&lt;/p&gt;

&lt;p&gt;Sample output of the API is provided below:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
"number":"117",
"language":"en",
"insult": "Some cause happiness wherever they go; others, whenever they go.",
"created":"2020-11-22 23:00:15",
"shown":"45712",
"createdby":"",
"active":"1",
"comment":"http:\/\/www.mirror.co.uk\/news\/weird-news\/worlds-20-most-bizarre-insults-7171396"
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;You get the other properties as well such as the time it was created, the language, any comment as well as the views. &lt;/p&gt;

&lt;h3&gt;
  
  
  3. Movies and TV API
&lt;/h3&gt;

&lt;p&gt;TMDb is a famous API, but do you know there are other API that provides insights from specific shows and movies?&lt;/p&gt;

&lt;p&gt;Below are some of the APIs you can use to develop apps featuring your favorite show:&lt;br&gt;
Breaking Bad API&lt;br&gt;
API of Ice And Fire &lt;br&gt;
Harry Potter API&lt;br&gt;
YouTube API (for embedding YouTube functionalities)&lt;br&gt;
The Lord of the Rings API&lt;br&gt;&lt;br&gt;
Like the API above, you can get started with some of the APIs without even signing up for a key.&lt;/p&gt;

&lt;p&gt;Not only this, using non-copyright images, you can truly create a great fan app for your beloved shows.&lt;/p&gt;

&lt;p&gt;Below is a sample output from the Breaking Bad API which you can get here which is the Best free APIs.&lt;/p&gt;

&lt;p&gt;It doesn’t require a key however has a rate limit of 10,000 requests per day.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
   [
      {
         "quote_id":1,
         "quote": "I am not in danger, Skyler. I am the danger!",
         "author":"Walter White",
         "series": "Breaking Bad"
      },
      {
         "quote_id":2,
         "quote":"Stay out of my territory.",
         "author":"Walter White",
         "series":"Breaking Bad"
      },
      {
         "quote_id":3,
         "quote":"IFT",
         "author":"Skyler White",
         "series":"Breaking Bad"
      }
      .....
   ]
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;It returns a JSON containing an array of objects with quotes, the author of the quotes, and an ID.&lt;/p&gt;

&lt;p&gt;You can mix these dedicated APIs with YouTube API to create an ultimate app for the fans of these shows.&lt;/p&gt;

&lt;h3&gt;
  
  
  4. Mapbox
&lt;/h3&gt;

&lt;p&gt;Mapbox provides precise location information and fully-fledged tools to developers.&lt;/p&gt;

&lt;p&gt;You get instant access to dynamic, live-updating maps which you can even further customize!&lt;/p&gt;

&lt;p&gt;If you have a project geared towards location and maps, this is a must-know API.&lt;/p&gt;

&lt;p&gt;However, it is worth mentioning that you have to sign up for free to get a unique access token.&lt;/p&gt;

&lt;p&gt;Using this token you can use the amazing services offered by this API.&lt;/p&gt;

&lt;p&gt;Not only this, you can use Mapbox with libraries such as the Leaflet.js library and create beautiful, mobile-friendly maps. So, there is the Best free APIs.&lt;/p&gt;

&lt;p&gt;I have discussed this and much more in my recent article covering the basics of Mapbox and Leaflet.js.&lt;/p&gt;

&lt;h3&gt;
  
  
  5. NASA API
&lt;/h3&gt;

&lt;p&gt;NASA provides a fabulous updated database of space-related information.&lt;/p&gt;

&lt;p&gt;Using this API, one can create mesmerizing and educational apps and websites.&lt;/p&gt;

&lt;p&gt;You get access to various different kinds of data from the Astronomy Picture of the Day all the way to the pictures captured by the Mars Rover.&lt;/p&gt;

&lt;p&gt;You can browse the entire list here.&lt;/p&gt;

&lt;p&gt;You can also retrieve NASA’s patents, software, and technology spinoff descriptions which you can use to build a patent portfolio.&lt;/p&gt;

&lt;p&gt;This API is really diverse and offers a wide variety of data. You can even access the NASA Image and Video library using it. It's the Best free APIs.&lt;/p&gt;

&lt;p&gt;Below is a sample query of the pictures captured by Curiosity on Mars.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
   "photos":[
      {
         "id":102693,
         "sol":1000,
         "camera":{
            "id":20,
            "name":"FHAZ",
            "rover_id":5,
            "full_name":"Front Hazard Avoidance Camera"
         },
         "img_src":"http://mars.jpl.nasa.gov/msl-raw-images/proj/msl/redops/ods/surface/sol/01000/opgs/edr/fcam/FLB_486265257EDR_F0481570FHAZ00323M_.JPG",
         "earth_date":"2015-05-30",
         "rover":{
            "id":5,
            "name":"Curiosity",
            "landing_date":"2012-08-06",
            "launch_date":"2011-11-26",
            "status":"active"
         }
      },
     .....
   ]
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  6. GIF Search
&lt;/h3&gt;

&lt;p&gt;We all love using and creating GIFs but did you know you can incorporate the GIFs in your next app for free using GIPHY?&lt;/p&gt;

&lt;p&gt;GIPHY is the largest GIF and sticker library in the world right now and using their official API you can leverage the vast collection to produce unique apps for free.&lt;/p&gt;

&lt;p&gt;Using the search endpoints, users can get the most relevant GIFs based on their queries.&lt;/p&gt;

&lt;p&gt;You also get access to analytics and other tools which will enable you to create a personalized user experience.&lt;/p&gt;

&lt;p&gt;The most used feature, however, for me was the translate endpoint which converts words and phrases to the perfect GIF or Sticker. You can specify the weirdness level on a scale of 0–10.&lt;/p&gt;

&lt;p&gt;Note that you have to provide proper attribution by displaying “Powered By GIPHY” wherever the API is utilized. These are the Best free APIs.&lt;/p&gt;

&lt;p&gt;Below is a sample output of this API:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
    data: GIF Object[]pagination:
    Pagination Objectmeta:
     Meta Object
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  7. Favourite Quotes API
&lt;/h3&gt;

&lt;p&gt;You can use these quotes to show on the landing page of your website or on the splash screen of your app to produce a rich user experience.&lt;/p&gt;

&lt;p&gt;You also get the ability to create and manage users and sessions via this API. However, there exists a rate limit of 30 requests in a 20-second interval per session. These are the Best free APIs.&lt;/p&gt;

&lt;p&gt;This API also has endpoints to filter, vote, list, update, and delete quotes.&lt;/p&gt;

&lt;p&gt;Below is the output for the Quote of the Day endpoint.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
   "qotd_date":"2020-11-23T00:00:00.000+00:00",
   "quote":{
      "id":29463,
      "dialogue":false,
      "private":false,
      "tags":[
         "great"
      ],
      "url":"https://favqs.com/quotes/walt-whitman/29463-the-great-cit-",
      "favorites_count":1,
      "upvotes_count":2,
      "downvotes_count":0,
      "author":"Walt Whitman",
      "author_permalink":"walt-whitman",
      "body": "The great city is that which has the greatest man or woman: if it is a few ragged huts, it is still the greatest city in the whole world."
   }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  8. Edamam Nutrition and Recipe Analysis API
&lt;/h3&gt;

&lt;p&gt;Edamam generously provides access to a database of over 700,000 food items and 1.7 million+ nutritionally analyzed recipes.&lt;/p&gt;

&lt;p&gt;This API is great if you want to showcase your frontend skills as you can add high-quality pictures of food alongside the recipe of that food provided by this API.&lt;/p&gt;

&lt;p&gt;The free plan can’t be used commercially however it provides a comprehensive set of features such as Natural Language Processing support and 200 recipes per month.&lt;/p&gt;

&lt;p&gt;You can find the full details regarding the different plans offered here.&lt;/p&gt;

&lt;p&gt;The users can simply type the ingredients and get the nutritional analysis which can help them eat smarter and better.&lt;/p&gt;

&lt;p&gt;You can check this cool feature here in the demo of this API. And these are the Best free APIs.&lt;/p&gt;

&lt;p&gt;They have other APIs as well which can be used in conjunction with the rest to create a one-stop food app.&lt;/p&gt;

&lt;p&gt;They have added a new diet filter specifically geared towards the ongoing pandemic which leverages scientific publications about nutrients and foods to enhance immunity.&lt;/p&gt;

</description>
    </item>
  </channel>
</rss>
