<?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: Asitha Lakshan</title>
    <description>The latest articles on DEV Community by Asitha Lakshan (@asithalakshan).</description>
    <link>https://dev.to/asithalakshan</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%2F931084%2F804a5a3e-003a-467e-a18c-195376ddffd0.jpeg</url>
      <title>DEV Community: Asitha Lakshan</title>
      <link>https://dev.to/asithalakshan</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/asithalakshan"/>
    <language>en</language>
    <item>
      <title>Can you find the Output of this Java Code</title>
      <dc:creator>Asitha Lakshan</dc:creator>
      <pubDate>Tue, 07 Jan 2025 13:08:45 +0000</pubDate>
      <link>https://dev.to/asithalakshan/can-you-find-the-output-of-this-java-code-520a</link>
      <guid>https://dev.to/asithalakshan/can-you-find-the-output-of-this-java-code-520a</guid>
      <description>&lt;p&gt;In Java programs, it always follows specific execution orders for various code blocks. From this article, I am going explore how different components in Java (static blocks, instance initializer blocks, constructors, methods, etc.) are executed with the help of the following example.&lt;/p&gt;

&lt;p&gt;Before continuing reading, try to determine the output of the following Java code by yourself and comment it on below before you go any further.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;public class Execute {
    public Execute() {
        System.out.println("Hello from constructor");
    }

    public void method() {
        System.out.println("Hello from method");
    }

    static {
        System.out.println("Hello from static block");
    }

    {
        System.out.println("Hello from instance initializer block");
    }

    public static void main(String[] args) {
        System.out.println("Hello from main");
        Execute obj = new Execute();
        obj.method();
    }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Output
&lt;/h2&gt;

&lt;p&gt;I assume now that you at least tried once to determine the output order. &lt;/p&gt;

&lt;p&gt;So the output of the above Java code will be:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Hello from static block
Hello from main
Hello from instance initializer block
Hello from constructor
Hello from method
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Did you able to determine it correctly?&lt;/p&gt;

&lt;p&gt;Now let's check why Java gives an output like the above.&lt;/p&gt;

&lt;h2&gt;
  
  
  Explanation
&lt;/h2&gt;

&lt;p&gt;When we run the above Java code, the execution order is as below&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Static Blocks&lt;/li&gt;
&lt;li&gt;The main Method&lt;/li&gt;
&lt;li&gt;Instance Initializer Block&lt;/li&gt;
&lt;li&gt;Constructor&lt;/li&gt;
&lt;li&gt;Method Execution&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Now let's look at these steps one by one&lt;/p&gt;

&lt;h2&gt;
  
  
  1. Static Blocks
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;static {
    System.out.println("Hello from static block");
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;A static block in Java is a block of code that is executed once when the class is loaded into memory by the JVM (Java virtual machine). This happens before the main method or any other instance-related code is executed.&lt;/p&gt;

&lt;p&gt;This is mostly used for static initialization, such as setting up static variables, or performing any necessary setup when the class is first used.&lt;/p&gt;

&lt;p&gt;In this code, the first line of output is by the static block:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Hello from static block
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  2. The main Method
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;public static void main(String[] args) {
    System.out.println("Hello from main");
    Execute obj = new Execute();
    obj.method();
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The main method is the entry point of any Java application.  It is where the program begins its execution when it is run.&lt;/p&gt;

&lt;p&gt;After the static block has been executed, the JVM begins executing the code inside the main method.&lt;/p&gt;

&lt;p&gt;In this code, the second line of output is by the main method:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Hello from main
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  3. Instance Initializer Block
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
    System.out.println("Hello from instance initializer block");
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;An Instance Initializer block in Java is a code block that is defined within a class but outside any method, constructor, or static block. It is executed every time an instance of the class is created, right before the constructor of the class is executed&lt;/p&gt;

&lt;p&gt;When we create an object with &lt;code&gt;Execute obj = new Execute();&lt;/code&gt;, the instance block runs before the constructor. This block is useful for initializing common properties of objects.&lt;/p&gt;

&lt;p&gt;In this code, the third line of output is by the Instance Initializer block:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Hello from instance initializer block
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  4. Constructor
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;public Execute() {
    System.out.println("Hello from constructor");
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The constructor is a special method used to initialize objects and is called automatically when a new object is created. It must have the same name as the class and It does not have a return type, not even void.&lt;/p&gt;

&lt;p&gt;It is executed immediately after the instance initializer block when an object is created. It’s typically used to initialize instance variables or perform any startup logic specific to that object.&lt;/p&gt;

&lt;p&gt;In this code, the fourth line of output is by the constructor:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Hello from constructor
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  5. Method Execution
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;public void method() {
    System.out.println("Hello from method");
}

public static void main(String[] args) {
....
    Execute obj = new Execute();
    obj.method();
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In Java, method execution refers to the process of invoking or calling a method to perform a specific task. Methods are blocks of code that perform operations, and their execution is initiated by calling the method from within the program.&lt;/p&gt;

&lt;p&gt;After the object is created and initialized, we explicitly call the method() function. This runs the code inside the method body.&lt;/p&gt;

&lt;p&gt;In this code, the last line of output is by the method execution:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Hello from method
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Why is the Execution Order this Important?
&lt;/h2&gt;

&lt;p&gt;Understanding the execution order in which different blocks execute is important for debugging and writing efficient Java programs. For an example:&lt;/p&gt;

&lt;p&gt;Static blocks are ideal for initializing class-level properties.&lt;br&gt;
Instance blocks are ideal for common object initialization logic.&lt;br&gt;
Constructors are ideal for handling object-specific setups.&lt;/p&gt;

&lt;p&gt;By knowing this order, you can write cleaner, more efficient, and maintainable Java code.&lt;/p&gt;

</description>
      <category>java</category>
      <category>programming</category>
      <category>spring</category>
      <category>codenewbie</category>
    </item>
    <item>
      <title>Incredible New Features in JavaScript ES15 (2024)</title>
      <dc:creator>Asitha Lakshan</dc:creator>
      <pubDate>Mon, 28 Oct 2024 17:06:29 +0000</pubDate>
      <link>https://dev.to/asithalakshan/incredible-new-features-in-javascript-es15-2024-56hh</link>
      <guid>https://dev.to/asithalakshan/incredible-new-features-in-javascript-es15-2024-56hh</guid>
      <description>&lt;p&gt;The latest ECMAScript version, ES15, introduces some new features to give great developer experience for Javascript developers. These enhancements span across different areas, from updated Javascript syntax and data handling to advancements in security, performance, and tools geared for developer productivity.&lt;/p&gt;

&lt;h2&gt;
  
  
  1. Array Grouping
&lt;/h2&gt;

&lt;p&gt;One of the most exciting (also one of my personal favorite) feature in ES15 is the Object.groupBy() method.&lt;br&gt;
This way simplifies the way of grouping elements in an array, based on specific criteria. This makes data manipulation more efficient and less error-prone.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Example:&lt;/em&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const cities = [
  { name: 'Melbourne', country: 'Australia' },  
  { name: 'Auckland', country: 'New Zealand' },
  { name: 'Sydney', country: 'Australia' },
  { name: 'Brisbane', country: 'Australia' },
  { name: 'Wellington', country: 'New Zealand' }
];

const groupedByCountry = Object.groupBy(cities, fruit =&amp;gt; fruit.country);
console.log(groupedByCountry);

// Output:
// {
//   "Australia": [
//       { "name": "Melbourne", "country": "Australia" },
//       { "name": "Sydney", "country": "Australia" },
//       { "name": "Brisbane", "country": "Australia" }
//   ],
//   "New Zealand": [
//       { "name": "Auckland", "country": "New Zealand" },
//       { "name": "Wellington", "country": "New Zealand" }
//   ]
// }
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;By using this feature, we can reduce the need for custom functions or third-party libraries that we traditionally use for array grouping.&lt;/p&gt;

&lt;p&gt;Also with this feature, we can make our code more understandable and maintainable by expressing our intent directly &lt;/p&gt;

&lt;h2&gt;
  
  
  2. Pipeline Operator (|&amp;gt;)
&lt;/h2&gt;

&lt;p&gt;Sometimes we need to use multiple functions as a chaining process. In that kind of scenario, we can use the pipeline operator (|&amp;gt;) to simplify the chaining process. &lt;/p&gt;

&lt;p&gt;&lt;em&gt;Example:&lt;/em&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const double = (x) =&amp;gt; x * 2;
const increment = (x) =&amp;gt; x + 1;
const square = (x) =&amp;gt; x * x;

const result = 5 |&amp;gt; double |&amp;gt; increment |&amp;gt; square;

// Output: 121
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The traditional way of doing above is this&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const double = (x) =&amp;gt; x * 2;
const increment = (x) =&amp;gt; x + 1;
const square = (x) =&amp;gt; x * x;

const result = square(increment(double(5)));
console.log(result);

// Output: 121
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;By using the pipeline operator we can use a more functional programming style. From that, we can make our code more readable by removing the complexity of deeply nested function calls.&lt;/p&gt;

&lt;h2&gt;
  
  
  3. Method Chaining Operator (?.())
&lt;/h2&gt;

&lt;p&gt;ES15 expands optional chaining by introducing the new Method Chaining Operator. This Method Chaining Operator adds safety to method invocation in deeply nested objects.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Example:&lt;/em&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const data = {
  user: {
    getName: () =&amp;gt; 'Tim'
  }
};

console.log(data.user?.getName?.());  // Output: 'Alice'
console.log(data.user?.getAge?.());  // Output: undefined
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The method chaining operator (?.()) allows you to safely invoke methods on potentially null or undefined objects. This reduces the risk of runtime errors caused by calling methods.&lt;/p&gt;

&lt;h2&gt;
  
  
  4. Set Methods Enhancements
&lt;/h2&gt;

&lt;p&gt;ES15 introduces several enhancements to the Set object, including new methods like &lt;strong&gt;union&lt;/strong&gt;, &lt;strong&gt;intersection&lt;/strong&gt;, &lt;strong&gt;difference&lt;/strong&gt;, and &lt;strong&gt;symmetricDifference&lt;/strong&gt;. These methods simplify common set operations.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const setA = new Set([1, 2, 3]);
const setB = new Set([3, 4, 5]);

const unionSet = setA.union(setB);
const differenceSet = setA.difference(setB);
const intersectionSet = setA.intersection(setB);
const symmetricDifferenceSet = setA.symmetricDifference(setB);

console.log(unionSet); // Output: {1, 2, 3, 4, 5}
console.log(differenceSet); // Output: {1, 2}
console.log(intersectionSet); // Output: {3}
console.log(symmetricDifferenceSet); // Output: {1, 2, 4, 5}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;union&lt;/strong&gt;&lt;br&gt;
The union() method of Set instances takes a set and returns a new set containing elements that are in either or both of this set and the given set.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;difference&lt;/strong&gt;&lt;br&gt;
The difference() method of Set instances takes a set and returns a new set containing elements in this set but not in the given set.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;intersection&lt;/strong&gt;&lt;br&gt;
The intersection() method of Set instances takes a set and returns a new set containing elements in both this set and the given set.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;symmetricDifference&lt;/strong&gt;&lt;br&gt;
The symmetricDifference() method of Set instances takes a set and returns a new set containing elements that are in either this set or the given set, but not in both.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  5. Enhanced JSON Modules
&lt;/h2&gt;

&lt;p&gt;In previous ECMAScript versions, developers relied on bundlers or loaders to import JSON files. ES15 now supports dynamic import and schema validation, making it easier to work with structured data and ensuring that imported data conforms to the expected format.&lt;/p&gt;

&lt;p&gt;You can now import JSON data directly, just like importing JavaScript modules.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Example:&lt;/em&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;// config.json
{
  "apiUrl": "https://api.example.com",
  "timeout": 5000,
  "features": {
    "enableFeatureX": true
  }
}
&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;import config from './config.json' assert { type: 'json' };

console.log(config.apiUrl); // Outputs: https://api.example.com
console.log(config.timeout); // Outputs: 5000
console.log(config.features.enableFeatureX); // Outputs: true
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;However, this change might break code that relies on older, non-standard ways of importing JSON, or if certain build tools are configured with older behaviors.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>javascript</category>
      <category>ecmascript</category>
      <category>programming</category>
    </item>
    <item>
      <title>Naming Conventions in Programming</title>
      <dc:creator>Asitha Lakshan</dc:creator>
      <pubDate>Fri, 11 Oct 2024 15:03:46 +0000</pubDate>
      <link>https://dev.to/asithalakshan/naming-conventions-in-programming-1o2f</link>
      <guid>https://dev.to/asithalakshan/naming-conventions-in-programming-1o2f</guid>
      <description>&lt;p&gt;As developers, there are many rules and best practices that we use in programming. One of the most important ones is the Naming conventions.&lt;/p&gt;

&lt;p&gt;As programmers, we use names in lots of things, such as variables, functions, classes, methods, interfaces, types, filenames, and so on. There are several principles of naming conventions for a design system are listed below.&lt;/p&gt;

&lt;h2&gt;
  
  
  Clarity and obviousness
&lt;/h2&gt;

&lt;p&gt;Names should be evident and unambiguous.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;// bad
var value = 'James';

// bad
var val = 'James';

// good
var firstName = 'James';
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Consistency and organization
&lt;/h2&gt;

&lt;p&gt;The same name should be used for the same object, and there should be consistency in how each component name is created.&lt;/p&gt;

&lt;h2&gt;
  
  
  Uniqueness
&lt;/h2&gt;

&lt;p&gt;Do not use repeating names to avoid conflicts.&lt;/p&gt;

&lt;h2&gt;
  
  
  Prefixes and Suffixes
&lt;/h2&gt;

&lt;p&gt;We can use prefixes or suffixes for elements of different types.&lt;br&gt;
Example: We can use “btn” for buttons, “lbl” for labels, etc.&lt;/p&gt;
&lt;h2&gt;
  
  
  Use Case Types in Programming
&lt;/h2&gt;

&lt;p&gt;Lets think we need to create a variable in our code. The name of the variable is more than just one word. It has to be a meaningful readable name.&lt;br&gt;
Also, we cannot use spaces in the naming in programming. Therefore we cannot use variable names like those below.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;first name = 'James'
last name = 'William'
user Id = 'af6b3dff-c023-40b1-a32f-163b6071f360'
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;That is where Naming Conventions come from&lt;/p&gt;

&lt;p&gt;There are sets of standards that are generally accepted by the developers for Naming conventions. Developers are using different case types to name different entities in code. These are the most popular case types among developers.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Camel Case&lt;/li&gt;
&lt;li&gt;Snake Case&lt;/li&gt;
&lt;li&gt;Kebab Case&lt;/li&gt;
&lt;li&gt;Pascal Case&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Camel Case
&lt;/h2&gt;

&lt;p&gt;camelCase is a naming convention where the first word is always lowercase and every other word starts with a capital letter.&lt;/p&gt;

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

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;firstName = 'James'
lastName = 'William'
userId = 'af6b3dff-c023-40b1-a32f-163b6071f360'
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Commonly used in:&lt;/strong&gt; Java, JavaScript, and TypeScript for creating variable, function, and method names&lt;/p&gt;

&lt;h2&gt;
  
  
  Snake Case
&lt;/h2&gt;

&lt;p&gt;snake_case is a naming convention where each word is in lowercase, and separated by underscores.&lt;/p&gt;

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

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;first_name = 'James'
last_name = 'William'
user_id = 'af6b3dff-c023-40b1-a32f-163b6071f360'
CONSTATNT_VALUE = 'value'
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Commonly used in:&lt;/strong&gt; Python, Ruby, C/C++ standard libraries, WordPress, database tables, and column names.&lt;/p&gt;

&lt;h2&gt;
  
  
  Kebab Case
&lt;/h2&gt;

&lt;p&gt;kebab-case is a naming convention where each word is in lowercase, and separated by dashes.&lt;/p&gt;

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

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;first-name = 'James'
last-name = 'William'
user-id = 'af6b3dff-c023-40b1-a32f-163b6071f360'
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Commonly used in:&lt;/strong&gt; COBOL, Lisp, Perl 6, CSS class names, HTML ids, URLs.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Pascal Case&lt;/strong&gt;&lt;br&gt;
PascalCase is a naming convention where the first letter in every word is a capital letter and the rest is in lowercase.&lt;/p&gt;

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

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;FirstName = 'James'
LastName = 'William'
UserId = 'af6b3dff-c023-40b1-a32f-163b6071f360'
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;**Commonly used in: **Pascal, Modula, .NET, Java classes and enums, JavaScript classes, typescript types and interfaces.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>javascript</category>
      <category>programming</category>
    </item>
    <item>
      <title>Public Your localhost URLs with Pinggy</title>
      <dc:creator>Asitha Lakshan</dc:creator>
      <pubDate>Fri, 11 Oct 2024 14:52:11 +0000</pubDate>
      <link>https://dev.to/asithalakshan/public-your-localhost-urls-with-pinggy-46op</link>
      <guid>https://dev.to/asithalakshan/public-your-localhost-urls-with-pinggy-46op</guid>
      <description>&lt;p&gt;Pinggy is a secure tunneling service to localhost that allows you to share your website or app easily with the public. It Creates HTTP, TCP, or TLS tunnels to your Mac / PC even if it is sitting behind firewalls and NATs.&lt;/p&gt;

&lt;p&gt;You do not need to configure a cloud or server to host your websites or do not need to install any apps or packages into your local PC.&lt;/p&gt;

&lt;p&gt;Also, Pinggy provides a powerful TUI and a Web Debugger for monitoring and debugging incoming requests in real-time.&lt;/p&gt;

&lt;h2&gt;
  
  
  Share your localhost URL
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;Run your application on localhost&lt;/li&gt;
&lt;li&gt;Find the localhost port where your application is running&lt;/li&gt;
&lt;li&gt;Goto pinggy.io and enter the Your local port&lt;/li&gt;
&lt;/ol&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%2F9fxb73siku6jfbuu5qiv.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%2F9fxb73siku6jfbuu5qiv.png" alt="Image description" width="800" height="377"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Copy the command generated by the pinggy.io and run it on your localhost to start the tunnel
&lt;code&gt;ssh -p 443 -R0:localhost:3000 -L4300:localhost:4300 qr@a.pinggy.io&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;After running the command you can see the public URL and the QR code for the tunnel.&lt;/li&gt;
&lt;/ol&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%2Fpn859ijgk1lymmej91w4.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%2Fpn859ijgk1lymmej91w4.png" alt="Image description" width="800" height="303"&gt;&lt;/a&gt;&lt;/p&gt;

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