DEV Community: ViGnEsH

Static vs Non-Static in Java

ViGnEsH — Fri, 03 Jul 2026 09:19:14 +0000

July 3 2026

Static

Static refers to class-specific information; only one memory copy is needed.

Memory is allocated only once.
It can be accessed without creating an object.
Shared by all objects of the class.

Example

class Fruits
{

static String fruitName ="Apple";
static String fruitName1 ="Mango";

public static void main(String[] args){

System.out.println("1 "+Fruits.fruitName+" $" +Fruits.price);
}
}

Non-Static

Non-static used has object-specific information
(or)
Object is a memony refers of class`

Each object has its own copy.
You must create an object to access it.
Different objects can store different values.

`java
class Fruits
{
String fruitName2 = "Banana";
int price2 = 10;

public static void main(String[] args){

Fruits basket = new Fruits();
System.out.println("3 "+basket.fruitName2+" $ "+basket.price2);

}
}
`

Java Data Types

ViGnEsH — Wed, 01 Jul 2026 11:08:33 +0000

Primitive Data Types

Primitive data types are the most basic data types available in Java. There are eight primitive data types, each serving a specific purpose:

1. byte:

Size: 8-bit
Range: -128 to 127
Usage: Memory-efficient storage in large arrays.

byte b = 100;

2. short:

Size: 16-bit
Range: -32,768 to 32,767
Usage: Suitable for saving memory in large arrays.

short s = 10000;

3. int:

Size: 32-bit
Range: -(2 to 231-1
Usage: Default choice for integer values.

int i = 100000;

4. long:

Size: 64-bit
Range: -263 to 263-1
Usage: For large integer values.

long l = 100000L;

5. float:

Size: 32-bit
Usage: For fractional numbers, with single precision.

float f = 234.5f;

6. double:

Size: 64-bit
Usage: For fractional numbers, with double precision.

double d = 123.4;

7. boolean:

Values: true or false
Usage: For simple flags and conditions.

boolean flag = true;

8. char:

Size: 16-bit
Range: 0 to 65,535 (Unicode characters)
Usage: For storing characters.

char c = 'A';

Non-Primitive Data Types

Non-primitive data types in Java include Strings, Arrays, Classes, Objects, Interfaces, and Collections. They store references to data, support methods and properties, and are used to represent more complex information than primitive data types.

Java Programming

Output:

Platform Architecture of Java, node.js, python

ViGnEsH — Tue, 30 Jun 2026 10:14:39 +0000

June 30 2026

Programming languages

Choosing the right programming language for backend development is one of the most important decisions in software development.
Among the most popular choices are Java, Node.js, and Python.
Although all three can build powerful applications.

Their architectures and execution models are very different.

Java Architecture

Java follows the principle "Write Once, Run Anywhere (WORA)."

Architecture Flow

Java Source Code (.java)
        │
        ▼
Java Compiler (javac)
        │
        ▼
Bytecode (.class)
        │
        ▼
Java Virtual Machine (JVM)
        │
        ▼
Operating System
        │
        ▼
Hardware

Node.js Architecture

Node.js is a JavaScript runtime built on Google's V8 JavaScript engine.

Architecture Flow

JavaScript Code
        │
        ▼
Node.js Runtime
        │
 ┌───────────────────┐
 │ V8 Engine         │
 │ Event Loop        │
 │ Libuv             │
 └───────────────────┘
        │
        ▼
Operating System
        │
        ▼
Hardware

Python Architecture

Python is an interpreted programming language known for its simplicity.

Architecture Flow

Python Source Code (.py)
        │
        ▼
Python Interpreter
        │
        ▼
Python Bytecode (.pyc)
        │
        ▼
Python Virtual Machine (PVM)
        │
        ▼
Operating System
        │
        ▼
Hardware

Comparison

Feature	Java	Node.js	Python
Language	Java	JavaScript	Python
Runtime	JVM	Node.js Runtime	Python Interpreter
Compilation	Bytecode	JIT to Machine Code	Bytecode
Execution Model	JVM	Event Loop	Python Virtual Machine
Performance	High	Very High	Moderate
Concurrency	Multithreading	Event-driven	Threads, Processes, Async
Platform Independent	Yes	Yes	Yes
Best For	Enterprise Systems	APIs & Real-time Apps	AI, Automation, Data Science

Platform Architecture of Java, node.js, python

ViGnEsH — Fri, 26 Jun 2026 09:26:32 +0000

June 26 2026

Programming languages

Choosing the right programming language for backend development is one of the most important decisions in software development.
Among the most popular choices are Java, Node.js, and Python.
Although all three can build powerful applications.

Their architectures and execution models are very different.

Java Architecture

Java follows the principle "Write Once, Run Anywhere (WORA)."

Architecture Flow

Java Source Code (.java)
        │
        ▼
Java Compiler (javac)
        │
        ▼
Bytecode (.class)
        │
        ▼
Java Virtual Machine (JVM)
        │
        ▼
Operating System
        │
        ▼
Hardware

Node.js Architecture

Node.js is a JavaScript runtime built on Google's V8 JavaScript engine.

Architecture Flow

JavaScript Code
        │
        ▼
Node.js Runtime
        │
 ┌───────────────────┐
 │ V8 Engine         │
 │ Event Loop        │
 │ Libuv             │
 └───────────────────┘
        │
        ▼
Operating System
        │
        ▼
Hardware

Python Architecture

Python is an interpreted programming language known for its simplicity.

Architecture Flow

Python Source Code (.py)
        │
        ▼
Python Interpreter
        │
        ▼
Python Bytecode (.pyc)
        │
        ▼
Python Virtual Machine (PVM)
        │
        ▼
Operating System
        │
        ▼
Hardware

Comparison

Feature	Java	Node.js	Python
Language	Java	JavaScript	Python
Runtime	JVM	Node.js Runtime	Python Interpreter
Compilation	Bytecode	JIT to Machine Code	Bytecode
Execution Model	JVM	Event Loop	Python Virtual Machine
Performance	High	Very High	Moderate
Concurrency	Multithreading	Event-driven	Threads, Processes, Async
Platform Independent	Yes	Yes	Yes
Best For	Enterprise Systems	APIs & Real-time Apps	AI, Automation, Data Science

Java programming

ViGnEsH — Thu, 25 Jun 2026 07:13:37 +0000

25 June 2026

What is Java?

Java is a popular, high-level, object-oriented programming language.
Developed by James Gosling at Sun Microsystems in 1995

platform independence

Java is the most important topic in OOPs, which is a type of Paradigm,

Paradigm

Java is a programming paradigm, a fundamental style, approach, or mindset used to structure, design, and write computer code

object-oriented programming language.

The features of an Object-Oriented Programming (OOP) language revolve around classes and objects,
Built upon four fundamental pillars:
Inheritance, Polymorphism, Encapsulation, Abstraction

Inheritance
In Java, it is possible to inherit attributes and methods from one class to another.

inheritance concept into two categories:

Superclass (Parent): The class whose features are inherited.
Subclass (Child): The class that inherits from the superclass. It can reuse parent fields/methods and add its own.

Java is a case-sensitive and structured programming language

ViGnEsH — Thu, 25 Jun 2026 06:50:41 +0000

June 24, 2026

errer 1

Current code

Output

Java is a case-sensitive and structured programming language

ViGnEsH — Wed, 24 Jun 2026 09:46:31 +0000

June 24, 2026

Error 1

Error 2

Error 3

Error 4

Error 5

Error 6

Error 7

Error 8

Error 9

Error 10

Current code

Output

useEffect

ViGnEsH — Mon, 01 Jun 2026 06:58:12 +0000

June 01 2026

What is useEffect?

The useEffect hook is a built-in React function component. useEffect accepts two arguments. The second argument is optional.
useEffect ( < function >, < dependency > )

Example

API calls
Updating document title
Event listeners
Timers (setTimeout, setInterval)

setTimeout:

setTimeout() = runs only once after the given time.

setInterval

setInterval() = repeats again and again

Use Navigate & BrowserRouter

ViGnEsH — Sat, 30 May 2026 07:44:51 +0000

May 30 2026

import { BrowserRouter, Link, Route, Routes } from "react-router-dom";
import About from "./About";
import Contact from "./Content";
import Home from "./Home";

function App(){

  return(
<>
<BrowserRouter>

<Link to ={"/"}>Home</Link>
<Link to ={"/About"}>About</Link>
<Link to ={"/Contact"}>Contact</Link>

< Routes >
  <Route path='/' element={<Home />} / >
  <Route path='/About' element={<About/ > } /  >
  < Route path='/Contact' element={< Contact / > } / >


</Routes>
</BrowserRouter>

{/* <Home /> */}
{/* <About/>  */}


</>
  )
}
export default App;

Link creates navigation links:
Home
About
Contact

Home

import { useNavigate } from "react-router-dom";

function About() {

  const navigate = useNavigate();


  function handleHome() {


    navigate("/")
  }

  return (

    <>
      About

      <button onClick={handleHome}>BACK TO HOME</button>
    </>
  )
}
export default About;

About

import { useNavigate } from "react-router-dom";

function About() {

  const navigate = useNavigate();


  function handleHome() {


    navigate("/")
  }

  return (

    <>
      About

      <button onClick={handleHome}>BACK TO HOME</button>
    </>
  )
}
export default About;

Content

import { useNavigate } from "react-router-dom";

function Contact(){

 const navigate = useNavigate();
  function handleContact() {
    navigate ("/About")
  }
  return(

    <>Contact

    <button onClick={handleContact}>Back About</button>
    </>
  )
}
export default Contact;

React – useState Scenarios

ViGnEsH — Tue, 26 May 2026 10:36:33 +0000

2026 May 26

1) Toggle Button

Switch between "ON" and "OFF"`

      <h1>ToggleButton</h1>
      <img className="base" width="100" height="100" src={isOn ?  " https://images.pexels.com/photos/37705633/pexels-photo-37705633.jpeg " : "https://images.pexels.com/photos/32179609/pexels-photo-32179609.jpeg" } alt="" />
      <button className="base" width="20" height="20" onClick={()=> setOn(!isOn)}>{isOn ? "SUN": "MOON"}</button>

Best state type: Boolean
False => Off
True => On
Initially set to false (Moon mode)

Conditional Rendering
The magic happens with the ternary operator (? :):
src={isOn? "sun-url.jpg" : "moon-url.jpg"}
When isOn = true → shows Sun image
When isOn = false → shows Moon image

onClick={() => setOn(!isOn)}
Every click inverts the current state
!true becomes false ! false becomes true.

2) Input Field Value

useState("") / Creates memory for your text (starts empty)
onChange={(e) => setText(e.target.value)} / Captures every keystroke
Hello, {text} / Displays your text instantly

3) Show / Hide Text

Best state type: Boolean
False => Hide
True => Show
button onClick={()=>setShow(!show)} - is a created arrow function inside the useState Function. Every click inverts the current state
!true becomes false ! false becomes true.

{show && <p>I am Vignesh K</p>} - condition true show a this line

4) CharacterCount

value={count} Links input to React state
onChange={(e)=>setCount(e.target.value)} Updates state on every keystroke

CharacterCount: {count.length}

Displays character count live

5) Form with Multiple Inputs

1 const [from, setFrom] = useState({...}) -> Stores all form data in ONE object
2 const handleFrom = (e) => { ( Function that runs on every ) input change
3 ...from ( copies of all existing data )
4 [e.target.name]: e.target.value ( Updates ONLY the field being typed in )
5 ( Each input updates state automatically )
6 < p >Name : {from.name} < / p > ( Displays live data below form )

Hooks

ViGnEsH — Tue, 19 May 2026 08:02:33 +0000

May 19 2026

Hooks are a special function in React, introduced in version 16.8, that allow you to "hook into" state and lifecycle features from functional components without writing a class.

Core Built-in Hooks

React provides several built-in Hooks to handle common tasks:

useState
useEffect
useContext
useReducer
useMomo & useCallback
useRef
use

useState

useState adds local state to a functional component, allowing it to "remember" information like user input or counter values.

**Toggle Button**

function set(){
  const [isOn, setIsOn] = useState(false);

return(
<div>
 <button onClick={() => setIsOn(!isOn)}>
                {isOn? "ON ": "OFF"}
            </button>
</div>
}

components

ViGnEsH — Fri, 15 May 2026 09:11:16 +0000

May 15 2026

components are mainly 2 types:

*1. Function compoents *

A Functional Component is a simple JavaScript function that returns JSX.

It is the modern and most commonly used component type in React.

function Welcome() {
  return <h1>Hello React</h1>;
}

export default Welcome;

2. Class Component

A Class Component is a React component created using an ES6 class.
It extends React.Component and must contain a render() method that returns JSX.

import React, { Component } from "react";

class Welcome extends Component {
  render() {
    return <h1>Hello Vignesh</h1>;
  }
}

export default Welcome;