<?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: Elayaraj C</title>
    <description>The latest articles on DEV Community by Elayaraj C (@elayaraj31).</description>
    <link>https://dev.to/elayaraj31</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%2F2951165%2Fdcb2aa75-05b0-4ced-a126-8fbdb1107a04.png</url>
      <title>DEV Community: Elayaraj C</title>
      <link>https://dev.to/elayaraj31</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/elayaraj31"/>
    <language>en</language>
    <item>
      <title>Docker Interview Questions and Answers</title>
      <dc:creator>Elayaraj C</dc:creator>
      <pubDate>Sat, 31 Jan 2026 06:06:05 +0000</pubDate>
      <link>https://dev.to/elayaraj31/docker-interview-questions-and-answers-496k</link>
      <guid>https://dev.to/elayaraj31/docker-interview-questions-and-answers-496k</guid>
      <description>&lt;p&gt;&lt;em&gt;&lt;strong&gt;Basic Docker Questions&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;1. What is Docker&lt;/strong&gt;?&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
Docker is a containerization platform that packages an application and its dependencies into a lightweight container so it can run consistently across different environments.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;2. What is a Docker container?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
A Docker container is a running instance of a Docker image. It includes the application, libraries, and runtime, isolated from the host system.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;3. What is a Docker image?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
A Docker image is a read-only template used to create containers. It contains application code, dependencies, and configuration.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;4. Difference between Docker image and container?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;/p&gt;

&lt;p&gt;Image: Blueprint (static, read-only)&lt;/p&gt;

&lt;p&gt;Container: Running instance of an image (dynamic)&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;5. Why do we use Docker?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;/p&gt;

&lt;p&gt;Environment consistency&lt;/p&gt;

&lt;p&gt;Easy deployment&lt;/p&gt;

&lt;p&gt;Lightweight compared to VMs&lt;/p&gt;

&lt;p&gt;Faster startup&lt;/p&gt;

&lt;p&gt;Supports microservices and CI/CD&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;6. Is Docker a virtual machine?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
No. Docker containers share the host OS kernel, while virtual machines run their own OS. Docker is faster and more lightweight.&lt;/p&gt;

&lt;p&gt;🔹 Docker Architecture Questions&lt;br&gt;
&lt;strong&gt;7. What are the main components of Docker?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;/p&gt;

&lt;p&gt;Docker Client&lt;/p&gt;

&lt;p&gt;Docker Daemon&lt;/p&gt;

&lt;p&gt;Docker Images&lt;/p&gt;

&lt;p&gt;Docker Containers&lt;/p&gt;

&lt;p&gt;Docker Registry (Docker Hub)&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;8. What is Docker Daemon?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
Docker Daemon (dockerd) runs in the background and handles building, running, and managing containers.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;9. What is Docker Hub?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
Docker Hub is a public registry where Docker images are stored and shared.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;10. What is /var/run/docker.sock?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
It is a Unix socket used by Docker client to communicate with the Docker daemon.&lt;/p&gt;

&lt;p&gt;🔹 Dockerfile &amp;amp; Build Questions&lt;br&gt;
&lt;strong&gt;11. What is a Dockerfile?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
A Dockerfile is a text file that contains instructions to build a Docker image.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;12. What are common Dockerfile instructions?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;/p&gt;

&lt;p&gt;FROM&lt;/p&gt;

&lt;p&gt;RUN&lt;/p&gt;

&lt;p&gt;COPY&lt;/p&gt;

&lt;p&gt;WORKDIR&lt;/p&gt;

&lt;p&gt;EXPOSE&lt;/p&gt;

&lt;p&gt;CMD&lt;/p&gt;

&lt;p&gt;ENTRYPOINT&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;13. Difference between CMD and ENTRYPOINT?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;/p&gt;

&lt;p&gt;ENTRYPOINT → fixed command&lt;/p&gt;

&lt;p&gt;CMD → default arguments (can be overridden)&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;14. What is a multi-stage build?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
A multi-stage build uses multiple FROM statements to reduce image size by copying only required artifacts into the final image.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;15. Why use .dockerignore?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
To exclude unnecessary files from the Docker build context, reducing image size and build time.&lt;/p&gt;

&lt;p&gt;🔹 Container Management Questions&lt;br&gt;
&lt;strong&gt;16. How do you list running containers?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;/p&gt;

&lt;p&gt;docker ps&lt;br&gt;
&lt;strong&gt;17. How do you list all containers?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;/p&gt;

&lt;p&gt;docker ps -a&lt;br&gt;
&lt;strong&gt;18. How do you stop and remove a container?&lt;/strong&gt;&lt;br&gt;
Answer:&lt;/p&gt;

&lt;p&gt;docker stop &lt;br&gt;
docker rm &lt;br&gt;
&lt;strong&gt;19. How do you enter a running container?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;/p&gt;

&lt;p&gt;docker exec -it  /bin/bash&lt;br&gt;
&lt;strong&gt;20. How do you view container logs?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;/p&gt;

&lt;p&gt;docker logs &lt;br&gt;
🔹 Docker Volumes &amp;amp; Storage&lt;br&gt;
&lt;strong&gt;21. What is a Docker volume?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
A Docker volume is used to persist data outside the container lifecycle.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;22. Difference between volume and bind mount?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;/p&gt;

&lt;p&gt;Volume: Managed by Docker (recommended)&lt;/p&gt;

&lt;p&gt;Bind mount: Uses host directory directly&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;23. Why are volumes important?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
Because containers are temporary, volumes ensure data is not lost when containers stop or restart.&lt;/p&gt;

&lt;p&gt;🔹 Networking Questions&lt;br&gt;
&lt;strong&gt;24. What is the default Docker network?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
Bridge network.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;25. How do containers communicate?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
Containers in the same Docker network communicate using container names as hostnames.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;26. Difference between bridge and host network?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;/p&gt;

&lt;p&gt;Bridge: Isolated network (default)&lt;/p&gt;

&lt;p&gt;Host: Shares host’s network directly&lt;/p&gt;

&lt;p&gt;🔹 Docker Compose&lt;br&gt;
&lt;strong&gt;27. What is Docker Compose?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
Docker Compose is a tool used to define and run multi-container applications using a docker-compose.yml file.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;28. When should you use Docker Compose?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
When your application has multiple services like web server, database, cache, etc.&lt;/p&gt;

&lt;p&gt;🔹 Debugging &amp;amp; Errors&lt;br&gt;
&lt;strong&gt;29. What does “permission denied /var/run/docker.sock” mean?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
The user does not have permission to access Docker daemon.&lt;br&gt;
Fix by adding user to the docker group.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;What causes io: read/write on closed pipe error?&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Answer:&lt;br&gt;
It usually occurs due to Docker daemon permission issues, not Dockerfile errors.&lt;/p&gt;

&lt;p&gt;🔹 Advanced / Conceptual Questions&lt;br&gt;
&lt;strong&gt;31. How is Docker different from Kubernetes?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;/p&gt;

&lt;p&gt;Docker → containerization&lt;/p&gt;

&lt;p&gt;Kubernetes → orchestration (scaling, self-healing, load balancing)&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;32. How do you reduce Docker image size?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;/p&gt;

&lt;p&gt;Use slim/alpine images&lt;/p&gt;

&lt;p&gt;Multi-stage builds&lt;/p&gt;

&lt;p&gt;Remove unnecessary files&lt;/p&gt;

&lt;p&gt;Use .dockerignore&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;33. Can Docker containers run without Docker?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
No. Containers need a container runtime like Docker or containerd.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;34. What is BuildKit?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Answer:&lt;br&gt;
BuildKit is Docker’s modern build engine that improves performance, caching, and parallel builds.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;35. Explain Docker in one line (HR question)&lt;/strong&gt;&lt;br&gt;
Answer:&lt;br&gt;
Docker allows developers to build, ship, and run applications consistently using containers.&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Docker</title>
      <dc:creator>Elayaraj C</dc:creator>
      <pubDate>Sat, 31 Jan 2026 05:37:46 +0000</pubDate>
      <link>https://dev.to/elayaraj31/docker-2294</link>
      <guid>https://dev.to/elayaraj31/docker-2294</guid>
      <description>&lt;p&gt;&lt;strong&gt;What is Docker (one line)&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;A Docker container is a running instance of a Docker image. It includes the application, libraries, and runtime, isolated from the host system.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Why use Docker (short &amp;amp; practical)&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Consistency&lt;/strong&gt;: same environment on your laptop, CI, and production.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Portability&lt;/strong&gt;: images run anywhere the Docker engine runs.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Efficiency&lt;/strong&gt;: containers share the host kernel — they start fast and use less memory than VMs.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Simplifies CI/CD &amp;amp; microservices&lt;/strong&gt;: build, ship, and scale small independent services easily.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Core concepts (simple definitions)&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Image&lt;/strong&gt;: immutable blueprint (read-only).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Container&lt;/strong&gt;: running instance of an image (writable layer on top).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Registry&lt;/strong&gt;: storage for images (e.g., Docker Hub).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Dockerfile&lt;/strong&gt;: text file with build instructions for an image.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Volume / Bind mount&lt;/strong&gt;: ways to persist or share data outside a container.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Network drivers&lt;/strong&gt;: bridge (default), host, none, overlay (for multi-host).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Layer caching&lt;/strong&gt;: build reuses unchanged layers to speed up builds.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Minimal Dockerfile — what each line means&lt;/strong&gt;&lt;br&gt;
&lt;code&gt;FROM openjdk:17-jdk-slim      # base image with Java runtime&lt;br&gt;
WORKDIR /app                 # set working directory inside the image&lt;br&gt;
COPY build/libs/myapp.jar /app/myapp.jar&lt;br&gt;
EXPOSE 8080                  # documents the port the app uses&lt;br&gt;
ENTRYPOINT ["java","-jar","/app/myapp.jar"]&lt;/code&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;FROM: base image.&lt;/li&gt;
&lt;li&gt;WORKDIR: where subsequent commands run.&lt;/li&gt;
&lt;li&gt;COPY: copy files from host into the image.&lt;/li&gt;
&lt;li&gt;EXPOSE: documents a port (does not publish it).&lt;/li&gt;
&lt;li&gt;ENTRYPOINT: the executable used when container starts.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Tip&lt;/strong&gt;: add a .dockerignore to exclude build artifacts you don’t want in the image.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Essential commands (clean cheat-sheet)&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;General info&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;docker --version            # show docker client version
docker info                 # daemon summary (containers, images, storage driver)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Build images&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;docker build -t myapp:1.0 .   # build image from Dockerfile in current dir
docker build --no-cache -t myapp:1.0 .  # rebuild without cache

Run &amp;amp; lifecycle (create, start, stop, remove)
&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;docker run --name web -d -p 8080:80 nginx:latest
# -d (detached), -p hostPort:containerPort, --name containerName


docker run -it --rm ubuntu bash
# -it interactive, --rm remove on exit


docker ps                     # list running containers
docker ps -a                  # list all containers (including stopped)
docker stop &amp;lt;container&amp;gt;       # graceful stop
docker start &amp;lt;container&amp;gt;      # start stopped container
docker restart &amp;lt;container&amp;gt;    # restart
docker rm &amp;lt;container&amp;gt;         # remove container
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Images&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;code&gt;docker pull nginx:latest    # download image from registry&lt;br&gt;
docker images               # list local images&lt;br&gt;
docker rmi &amp;lt;image&amp;gt;          # remove image&lt;br&gt;
docker tag SOURCE:TAG TARGET:TAG  # retag an image&lt;br&gt;
docker save -o img.tar &amp;lt;image&amp;gt;    # save image to tar&lt;br&gt;
docker load -i img.tar             # load image from tar&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Inspect, exec &amp;amp; logs&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;code&gt;docker logs -f &amp;lt;container&amp;gt;          # follow logs&lt;br&gt;
docker exec -it &amp;lt;container&amp;gt; /bin/bash   # open shell inside running container&lt;br&gt;
docker inspect &amp;lt;container|image&amp;gt;    # JSON metadata and settings&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Volumes &amp;amp; mounts (persist data)&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;docker volume create myvol
docker run -v myvol:/data ...    # named volume
docker run -v /host/path:/data ... # bind mount
docker volume ls
docker volume rm myvol
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;Named volumes (managed by Docker) are best for databases and portability.&lt;/li&gt;
&lt;li&gt;Bind mounts map a host folder directly into the container (useful for development).&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Networking (quick)&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;docker network ls
docker network create mynet
docker run --network mynet ...
docker network inspect mynet

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

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Cleanup (free disk space)&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;docker system df
docker image prune          # remove dangling images
docker container prune      # remove stopped containers
docker system prune -a      # remove unused images/containers/networks (careful)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Compose (multi-container apps)&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;docker compose up -d
docker compose down
docker compose ps
docker compose logs -f
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Monitoring &amp;amp; debug&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;code&gt;docker stats                   # live resource usage&lt;br&gt;
docker top &amp;lt;container&amp;gt;         # processes running inside container&lt;/code&gt;&lt;/p&gt;

</description>
      <category>beginners</category>
      <category>devops</category>
      <category>docker</category>
      <category>tutorial</category>
    </item>
    <item>
      <title>React Learning</title>
      <dc:creator>Elayaraj C</dc:creator>
      <pubDate>Sat, 31 Jan 2026 05:26:42 +0000</pubDate>
      <link>https://dev.to/elayaraj31/react-learning-ejc</link>
      <guid>https://dev.to/elayaraj31/react-learning-ejc</guid>
      <description>&lt;p&gt;&lt;strong&gt;HTML Document Object Model&lt;/strong&gt;&lt;br&gt;
                     REACT LEARNING &lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;&lt;p&gt;Babel is use to convert the old java script to new Java Script code it is a tool.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Babel is a popular JavaScript transpiler (compiler) that converts modern JavaScript code (ES6+) into older, backward-compatible versions.&lt;/p&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;what is React?&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;React is a free and open-source JavaScript library used primarily for building user interfaces (UIs) on the web. Developed by Meta (formerly Facebook) in 2013, it has become one of the most popular tools for front-end development.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;App.js is the root file for react js.&lt;/strong&gt;&lt;br&gt;
&lt;strong&gt;what is virtual dom in react&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;The Virtual DOM (VDOM) is a lightweight copy of the actual DOM (the structure of your webpage). React uses it to make updates to your website faster and more efficient.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;What is JSX CODE?&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;JSX IS HTML + JAVA SCRIPT Combined CODE IS CALLED JSX.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;What is React Component?&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;A React Component is a small, reusable piece of code that represents a part of a web page.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;what is the use of props?&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Props (short for "Properties") allow you to pass data from one component to another component (specifically, from a parent to a child).&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;what is react state? what is usestate in react?&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;State is a React component's internal memory.&lt;/li&gt;
&lt;li&gt;useState is a React Hook that lets you add "memory" to your components.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Whst is the use of Spread Operator[...]?&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;In React, it is used primarily to copy data easily. Since React doesn't let you change (mutate) data directly, we often have to "copy the old data, change one thing, and save it as new data." &lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;The ... operator makes this very easy.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;the 3 Main Uses in React using ...&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Updating Objects (Without losing data)&lt;/li&gt;
&lt;li&gt;Adding to a List (Arrays)&lt;/li&gt;
&lt;li&gt;Passing Props Shortcut&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;what is useEffect in react?why we use&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;useEffect is a Hook that lets you perform Side Effects in your components.&lt;/li&gt;
&lt;li&gt;In React, a component's main job is to just convert data (State/Props) into HTML (UI). Any action that happens outside of this direct calculation is called a "Side Effect".&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;what is react router?&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;React Router is a standard routing library for React that enables client-side navigation in single-page applications (SPAs).&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;it allows you to build a React application with multiple pages/views without reloading the browser.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;what is nested route?&lt;/strong&gt;&lt;br&gt;
                In React Router, a nested route means a route inside another route. It is used when one page has a common layout and only a portion of the UI changes based on the URL.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;what is react forms?&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;In React, handling forms is slightly different from standard HTML. React wants to be in charge of the data at all times.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;
&lt;/li&gt;
&lt;/ul&gt;




</description>
      <category>react</category>
      <category>webdev</category>
    </item>
    <item>
      <title>java</title>
      <dc:creator>Elayaraj C</dc:creator>
      <pubDate>Mon, 28 Jul 2025 15:13:32 +0000</pubDate>
      <link>https://dev.to/elayaraj31/java-189</link>
      <guid>https://dev.to/elayaraj31/java-189</guid>
      <description></description>
      <category>java</category>
    </item>
    <item>
      <title>Tamil Startup MeetUp For Tamil-AI</title>
      <dc:creator>Elayaraj C</dc:creator>
      <pubDate>Mon, 28 Jul 2025 15:08:50 +0000</pubDate>
      <link>https://dev.to/elayaraj31/tamil-startup-meetup-for-tamil-ai-4779</link>
      <guid>https://dev.to/elayaraj31/tamil-startup-meetup-for-tamil-ai-4779</guid>
      <description>&lt;p&gt;&lt;strong&gt;My Experience at the Tamil AI Startup Meetup&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Today, I had the incredible opportunity to attend a Tamil AI startup meetup focused on developing AI technologies for Tamil language integration. It was an eye-opening experience filled with insights from industry professionals and innovators.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Session Highlights&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The day started with an enlightening session on &lt;strong&gt;NLP – Natural Language Processing&lt;/strong&gt;, where I learned about the foundations and real-world applications of NLP in Tamil. This session was led by &lt;strong&gt;Mr. Selva Murali&lt;/strong&gt;, who shared his deep knowledge in linguistics and the concept of "&lt;strong&gt;Mentamil&lt;/strong&gt;"—a linguistic approach tailored to Tamil's unique structure.&lt;/p&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%2F70zf9ico7yrydh3r3bw7.jpg" 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%2F70zf9ico7yrydh3r3bw7.jpg" alt=" " width="800" height="1066"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;We also explored &lt;strong&gt;ASR – Automated Speech Recognition&lt;/strong&gt; for Tamil. This technology is crucial for converting spoken Tamil into text, which has wide applications in voice assistants, transcription tools, and accessibility.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Post-Tea Break Learnings&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;After the tea break, we dived into more advanced topics such as &lt;strong&gt;Agentic AI in AWS (Amazon Web Services)&lt;/strong&gt;. This session introduced us to the emerging area of &lt;strong&gt;agent-based AI systems&lt;/strong&gt; and how AWS is supporting these developments.&lt;/p&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%2Fd2t5sqd9sx442l4neo0m.jpg" 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%2Fd2t5sqd9sx442l4neo0m.jpg" alt=" " width="800" height="600"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I also got to learn about &lt;strong&gt;Kero AI's Agent Cor&lt;/strong&gt;e, and important AWS protocols like &lt;strong&gt;MCP (Multi-Channel Protocol)&lt;/strong&gt; and &lt;strong&gt;A2A (Application-to-Application)&lt;/strong&gt; communication, which are essential for building scalable, cloud-native AI systems.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Company Introductions and Presentations&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Later in the session, &lt;strong&gt;Precision Infomatic&lt;/strong&gt;, an IT services company, introduced their work and showcased a well-prepared presentation (PPT) on various** AWS services **they offer, especially how they contribute to the AI ecosystem.&lt;/p&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%2Fn0nz8xro9gt08lbxlkun.jpg" 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%2Fn0nz8xro9gt08lbxlkun.jpg" alt=" " width="800" height="600"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Following this, the creative team from &lt;strong&gt;Overman Studio&lt;/strong&gt; gave a fascinating presentation on &lt;strong&gt;AI in movie making&lt;/strong&gt;. They showcased how AI is transforming the film industry, from script generation to visual effects and voice synthesis in Tamil.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Conclusion&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;This meetup was a treasure trove of knowledge, networking, and innovation. From language processing to cloud-based AI integration, every session contributed to a better understanding of how AI is being developed for and within the Tamil language. I'm grateful for the experience and look forward to exploring more in this space.&lt;/p&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%2Ffccskzoprh5sfyfow0xx.jpg" 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%2Ffccskzoprh5sfyfow0xx.jpg" alt=" " width="800" height="600"&gt;&lt;/a&gt;&lt;br&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%2Fwtzd65fobv3fqkfxcje0.jpg" 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%2Fwtzd65fobv3fqkfxcje0.jpg" alt=" " width="800" height="600"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>ai</category>
    </item>
    <item>
      <title>Understanding Annotations, Beans, Spring Container &amp; Dependency Injection in Spring Boot</title>
      <dc:creator>Elayaraj C</dc:creator>
      <pubDate>Tue, 08 Jul 2025 09:21:40 +0000</pubDate>
      <link>https://dev.to/elayaraj31/understanding-annotations-beans-spring-container-dependency-injection-in-spring-boot-20c3</link>
      <guid>https://dev.to/elayaraj31/understanding-annotations-beans-spring-container-dependency-injection-in-spring-boot-20c3</guid>
      <description>&lt;ul&gt;
&lt;li&gt;What annotations are&lt;/li&gt;
&lt;li&gt;What beans are&lt;/li&gt;
&lt;li&gt;What the Spring container is&lt;/li&gt;
&lt;li&gt;What dependency injection is&lt;/li&gt;
&lt;li&gt;Why, when, how to use all of them&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Understanding Annotations, Beans, Spring Container &amp;amp; Dependency Injection in Spring Boot&lt;/p&gt;

&lt;h2&gt;
  
  
  🔍 Introduction
&lt;/h2&gt;

&lt;p&gt;If you're learning &lt;strong&gt;Spring or Spring Boot,&lt;/strong&gt; you’ll constantly hear terms like:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;@Component, @Autowired, &lt;a class="mentioned-user" href="https://dev.to/bean"&gt;@bean&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;Spring container&lt;/li&gt;
&lt;li&gt;Dependency Injection (DI)&lt;/li&gt;
&lt;li&gt;Beans
And how do they help make your application clean, modular, and powerful?&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;** What are Annotations in Spring?**&lt;/p&gt;

&lt;p&gt;In Spring, &lt;strong&gt;annotations&lt;/strong&gt; are &lt;strong&gt;special markers&lt;/strong&gt; (starting with @) that tell the Spring framework to do certain things &lt;strong&gt;automatically&lt;/strong&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  Common Annotations:
&lt;/h2&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%2Fwrsy70l6lrf0cfi5y02j.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%2Fwrsy70l6lrf0cfi5y02j.png" alt=" " width="673" height="296"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  What is a Bean?
&lt;/h2&gt;

&lt;p&gt;In Spring, a Bean is just a &lt;strong&gt;Java object managed&lt;/strong&gt; by the &lt;strong&gt;Spring container&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;For example:&lt;/strong&gt;&lt;/p&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%2Fd0xco08wa080neg9vkii.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%2Fd0xco08wa080neg9vkii.png" alt=" " width="676" height="209"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This MyService class becomes a &lt;strong&gt;Spring Bean&lt;/strong&gt; because it’s annotated with @Component.&lt;/p&gt;

&lt;h2&gt;
  
  
  What is the Spring Container?
&lt;/h2&gt;

&lt;p&gt;The Spring container is the core of the Spring Framework.&lt;/p&gt;

&lt;p&gt;** It is responsible for:**&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Creating objects (beans)&lt;/li&gt;
&lt;li&gt;Managing their lifecycle&lt;/li&gt;
&lt;li&gt;Injecting dependencies into them&lt;/li&gt;
&lt;li&gt;Configuring them based on annotations or XML&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Think of the container as the &lt;strong&gt;brain that runs your Spring app.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;How does it work?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;When your app starts:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt; Spring scans your classes (like @Component, @Service)&lt;/li&gt;
&lt;li&gt; Creates and stores them in memory&lt;/li&gt;
&lt;li&gt; Connects everything together automatically&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;What is Dependency Injection (DI)?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Dependency Injection&lt;/strong&gt; means that &lt;strong&gt;an object’s dependencies are provided (injected) from the outside&lt;/strong&gt;, instead of the &lt;strong&gt;object creating them itself.&lt;/strong&gt;&lt;/p&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%2Fln1vo5z4jq576zsx34df.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%2Fln1vo5z4jq576zsx34df.png" alt=" " width="686" height="316"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Spring takes care of creating the object and injecting it where needed.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Why Use Dependency Injection?&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Loose coupling – makes code easier to test and maintain&lt;/li&gt;
&lt;li&gt;Better modularity&lt;/li&gt;
&lt;li&gt;Cleaner code with fewer new keywords&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;How Spring Does Dependency Injection&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Spring supports 3 types of DI:&lt;/strong&gt;&lt;/p&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%2Fu6ytklhwj9y0jr7pb6gs.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%2Fu6ytklhwj9y0jr7pb6gs.png" alt=" " width="648" height="213"&gt;&lt;/a&gt;&lt;/p&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%2Fafanfzv0dp4b4c3gfao4.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%2Fafanfzv0dp4b4c3gfao4.png" alt=" " width="676" height="332"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Spring will automatically &lt;strong&gt;create&lt;/strong&gt; the Engine bean and &lt;strong&gt;inject&lt;/strong&gt; it into Car.&lt;/p&gt;

&lt;h2&gt;
  
  
  When and Why to Use Spring Annotations &amp;amp; DI?
&lt;/h2&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%2F5jd9oafzbt5ctymei1jg.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%2F5jd9oafzbt5ctymei1jg.png" alt=" " width="676" height="439"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>java</category>
    </item>
    <item>
      <title>What is HTML?</title>
      <dc:creator>Elayaraj C</dc:creator>
      <pubDate>Tue, 08 Jul 2025 07:14:18 +0000</pubDate>
      <link>https://dev.to/elayaraj31/what-is-html-1l6j</link>
      <guid>https://dev.to/elayaraj31/what-is-html-1l6j</guid>
      <description>&lt;p&gt;What is HTML? &lt;/p&gt;

&lt;p&gt;If you’ve ever wondered how websites are made, the answer starts with HTML. Whether it’s a blog, an online store, or a social media site — they all use HTML in the background.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;In this blog post:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;    What is HTML?&lt;/li&gt;
&lt;li&gt;    Why is HTML important?&lt;/li&gt;
&lt;li&gt;    Basic structure of an HTML document&lt;/li&gt;
&lt;li&gt;    Common HTML tags with examples&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;What is HTML?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;HTML stands for HyperText Markup Language.&lt;br&gt;
It is the standard language used to create and structure content on the web. &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Think of HTML as the skeleton of a webpage.&lt;/li&gt;
&lt;li&gt;It tells the browser how to display text, images, links, videos, and more.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Why is HTML important?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;HTML is important because it:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt; Structures your webpage content.&lt;/li&gt;
&lt;li&gt; Helps search engines understand your site.&lt;/li&gt;
&lt;li&gt; Works with CSS and JavaScript to make your site look good and interact with users.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Basic Structure of an HTML Document&lt;/p&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%2F8yxi1nnwie345yw7vgx2.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%2F8yxi1nnwie345yw7vgx2.png" alt=" " width="550" height="314"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Explanation:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&amp;lt;!DOCTYPE html&amp;gt; – Tells the browser this is an HTML5 document.&lt;/li&gt;
&lt;li&gt;  – The root tag of an HTML page.&lt;/li&gt;
&lt;li&gt;  – Contains meta-information (like title, links, and scripts).&lt;/li&gt;
&lt;li&gt;  – Sets the page title (shown on browser tab).&lt;/li&gt;
&lt;li&gt;  – Contains the visible content like text, images, and buttons.&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>html</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Understanding Dynamic Binding in Java</title>
      <dc:creator>Elayaraj C</dc:creator>
      <pubDate>Sat, 14 Jun 2025 07:49:42 +0000</pubDate>
      <link>https://dev.to/elayaraj31/understanding-dynamic-binding-in-java-40oa</link>
      <guid>https://dev.to/elayaraj31/understanding-dynamic-binding-in-java-40oa</guid>
      <description>&lt;p&gt;&lt;strong&gt;🔸 What is Binding in Java?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Binding means linking a method call to the method definition. There are two types of binding in Java:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Static Binding – happens at compile time&lt;/li&gt;
&lt;li&gt;Dynamic Binding – happens at runtime&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;🔸 What is Dynamic Binding?&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Dynamic Binding (or Late Binding) is when Java decides at runtime which method to call based on the actual object, not the reference type.&lt;/li&gt;
&lt;li&gt;Java where the method implementation to be executed is determined at runtime based on the actual object type, not just its declared type.&lt;/li&gt;
&lt;li&gt;This differs from static binding, where the method call is resolved at compile time&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;When and Why Use Dynamic Binding?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;You should use it when:&lt;/p&gt;

&lt;p&gt;✅ You want runtime polymorphism&lt;br&gt;
✅ You are working with inheritance and method overriding&lt;br&gt;
✅ You want your code to be flexible, reusable, and loosely coupled&lt;/p&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%2F3158tjz9v2x320pexphx.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%2F3158tjz9v2x320pexphx.png" alt="Image description" width="782" height="258"&gt;&lt;/a&gt;&lt;/p&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%2Fq7u8zn4bygim28vrc9xc.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%2Fq7u8zn4bygim28vrc9xc.png" alt="Image description" width="600" height="243"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;
  
  
  Java Dynamic Binding
&lt;/h2&gt;

&lt;p&gt;Dynamic binding refers to the process in which linking between method call and method implementation is resolved at run time (or, a process of calling an overridden method at run time). Dynamic binding is also known as run-time polymorphism or late binding. Dynamic binding uses objects to resolve binding.&lt;/p&gt;

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

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;package com.tutorialspoint;

class Animal {
   public void move() {
      System.out.println("Animals can move");
   }
}

class Dog extends Animal {
   public void move() {
      System.out.println("Dogs can walk and run");
   }
}

public class Tester {

   public static void main(String args[]) {
      Animal a = new Animal();   // Animal reference and object
      // Dynamic Binding      
      Animal b = new Dog();   // Animal reference but Dog object

      a.move();   // runs the method in Animal class
      b.move();   // runs the method in Dog class
   }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Java Dynamic Binding: Using the super Keyword&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;When invoking a superclass version of an overridden method the super keyword is used so that we can utilize parent class method while using dynamic binding.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Example&lt;/strong&gt;: Using the super Keyword&lt;/p&gt;

&lt;p&gt;In this example, we've created two classes Animal and Dog where Dog class extends Animal class. Dog class overrides the move method of its super class Animal. But it calls parent move() method using super keyword so that both move methods are called when child method is called due to dynamic binding. In main() method, we're using Animal class reference and assign it an object of Dog class to check Dynamic binding effect.&lt;br&gt;
Open Compiler&lt;br&gt;
&lt;strong&gt;example:&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;class Animal {
   public void move() {
      System.out.println("Animals can move");
   }
}

class Dog extends Animal {
   public void move() {
      super.move();   // invokes the super class method
      System.out.println("Dogs can walk and run");
   }
}

public class TestDog {

   public static void main(String args[]) {
      Animal b = new Dog();   // Animal reference but Dog object
      b.move();   // runs the method in Dog class
   }
}

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

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Output&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Animals can move&lt;br&gt;
Dogs can walk and run&lt;/p&gt;

</description>
      <category>java</category>
    </item>
    <item>
      <title>Java Full Stack Developer (Fresher)</title>
      <dc:creator>Elayaraj C</dc:creator>
      <pubDate>Sat, 07 Jun 2025 16:47:23 +0000</pubDate>
      <link>https://dev.to/elayaraj31/java-full-stack-developer-fresher-51gk</link>
      <guid>https://dev.to/elayaraj31/java-full-stack-developer-fresher-51gk</guid>
      <description>&lt;p&gt;&lt;strong&gt;🔹 1. Core Java (Very Important)&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;OOPs concepts (Inheritance, Polymorphism, Abstraction, Encapsulation)&lt;/li&gt;
&lt;li&gt;Data Types, Loops, Conditions&lt;/li&gt;
&lt;li&gt;Collections Framework (List, Set, Map, etc.)&lt;/li&gt;
&lt;li&gt;Exception Handling&lt;/li&gt;
&lt;li&gt;Multithreading (basic understanding)&lt;/li&gt;
&lt;li&gt;Java 8 features: Streams, Lambdas, Functional interfaces, Optional&lt;/li&gt;
&lt;li&gt;String, StringBuilder, StringBuffer&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;🔹 2. Java Backend Technologies&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;**  Spring Core:** Dependency Injection, Bean Life Cycle&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;**Spring Boot:**
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;ul&gt;
&lt;li&gt;Annotations (@RestController, @Autowired, @Service, etc.)&lt;/li&gt;
&lt;li&gt;REST API creation&lt;/li&gt;
&lt;li&gt;Application properties/yml&lt;/li&gt;
&lt;li&gt;CRUD operations with database&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Spring Data JPA:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;@Entity, &lt;a class="mentioned-user" href="https://dev.to/id"&gt;@id&lt;/a&gt;, @GeneratedValue&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;JpaRepository, Query methods&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Hibernate Basics&lt;/strong&gt; (Optional if using JPA)&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;🔹 3. Database (Backend Integration)&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;SQL (Important)&lt;/li&gt;
&lt;li&gt; Basic queries: SELECT, JOIN, GROUP BY, ORDER BY, etc.&lt;/li&gt;
&lt;li&gt; Normalization&lt;/li&gt;
&lt;li&gt; CRUD operations&lt;/li&gt;
&lt;li&gt; Relational Databases: MySQL, PostgreSQL&lt;/li&gt;
&lt;li&gt; Basics of connecting DB to Spring Boot&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;🔹 4. Frontend Technologies&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;HTML, CSS: Forms, Layouts, Flex/Grid&lt;/li&gt;
&lt;li&gt;    JavaScript (Basic):&lt;/li&gt;
&lt;li&gt;        Functions, Events, DOM Manipulation&lt;/li&gt;
&lt;li&gt;        ES6 features (let/const, arrow functions)&lt;/li&gt;
&lt;li&gt;    ReactJS (or Angular basics if you prefer):&lt;/li&gt;
&lt;li&gt;        Components&lt;/li&gt;
&lt;li&gt;        Props, State&lt;/li&gt;
&lt;li&gt;        Event handling&lt;/li&gt;
&lt;li&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;    Conditional rendering
useEffect, useState hooks (if React)
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;OR: Thymeleaf (for Java-based templating)&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;🔹 5. Tools and Technologies&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Maven/Gradle – Build tools&lt;/li&gt;
&lt;li&gt;Git/GitHub – Version control&lt;/li&gt;
&lt;li&gt;Postman – API testing&lt;/li&gt;
&lt;li&gt;Lombok – for clean code in Java (@Getter, &lt;a class="mentioned-user" href="https://dev.to/setter"&gt;@setter&lt;/a&gt;, etc.)&lt;/li&gt;
&lt;li&gt;Basic Unit Testing: JUnit&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;🔹 6. Soft Skills &amp;amp; General Questions&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt; Ability to explain your project clearly (even if small)&lt;/li&gt;
&lt;li&gt; Why you want to be a Java Full Stack Developer&lt;/li&gt;
&lt;li&gt; Your learning attitude and problem-solving skills&lt;/li&gt;
&lt;li&gt; Version control: basic git commands&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;🔹 Optional but Helpful&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Deployment basics (e.g., using Heroku, Netlify)&lt;/li&gt;
&lt;li&gt;RESTful principles&lt;/li&gt;
&lt;li&gt;JWT Token basics for security&lt;/li&gt;
&lt;li&gt;JSON vs XML&lt;/li&gt;
&lt;li&gt;Understanding of Agile/Scrum&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;✅ Suggestion for Practice:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Create a mini project (e.g., Employee Management System, Book Store App) using:&lt;/li&gt;
&lt;li&gt;Spring Boot + React or HTML/JS&lt;/li&gt;
&lt;li&gt;CRUD operations&lt;/li&gt;
&lt;li&gt;MySQL or PostgreSQL&lt;/li&gt;
&lt;li&gt;GitHub repository&lt;/li&gt;
&lt;/ul&gt;

</description>
    </item>
    <item>
      <title>Understanding Template Literals and the DOM in JavaScript</title>
      <dc:creator>Elayaraj C</dc:creator>
      <pubDate>Thu, 29 May 2025 16:09:49 +0000</pubDate>
      <link>https://dev.to/elayaraj31/understanding-template-literals-and-the-dom-in-javascript-4n4e</link>
      <guid>https://dev.to/elayaraj31/understanding-template-literals-and-the-dom-in-javascript-4n4e</guid>
      <description>&lt;p&gt;&lt;strong&gt;What Are Template Literals?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Template literals are an improved way to handle strings in JavaScript.&lt;br&gt;
Instead of using single quotes ' ' or double quotes " ", template literals use backticks (`).&lt;/p&gt;

&lt;p&gt;But they’re not just another way to define strings — they unlock new powers:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Insert variables or expressions directly inside strings (string interpolation)&lt;/li&gt;
&lt;li&gt;Write multi-line strings without extra characters&lt;/li&gt;
&lt;li&gt;Embed dynamic content cleanly&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Basic Syntax&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;const name = 'Elayaraj';&lt;br&gt;
const greeting = &lt;code&gt;Hello, ${name}!&lt;/code&gt;;&lt;br&gt;
console.log(greeting);  // Output: Hello, Elayaraj!&lt;/p&gt;

&lt;p&gt;Notice:&lt;/p&gt;

&lt;p&gt;We use &lt;strong&gt;backticks&lt;/strong&gt; (`).&lt;br&gt;
We embed variables using ${}.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Why Use Template Literals?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Let’s compare.&lt;/p&gt;

&lt;p&gt;Without template literals:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;const name = 'Elayaraj';&lt;br&gt;
const greeting = 'Hello, ' + name + '!';&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;With template literals:&lt;br&gt;
&lt;code&gt;&lt;br&gt;
const greeting =&lt;/code&gt;Hello, ${name}!&lt;code&gt;;&lt;/code&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Cleaner&lt;/li&gt;
&lt;li&gt;Easier to read&lt;/li&gt;
&lt;li&gt;No annoying + signs everywhere
&lt;strong&gt;Multi-line Strings&lt;/strong&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Before template literals:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const text = 'This is line one.\n' +
             'This is line two.';
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;With template literals:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const text = `This is line one.
              This is line two.`;

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

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;No need for \n&lt;/li&gt;
&lt;li&gt;Write naturally across lines
&lt;strong&gt;Embedded Expressions&lt;/strong&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;You can run any expression inside ${}.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;const a = 5;&lt;br&gt;
const b = 10;&lt;br&gt;
console.log(&lt;code&gt;The sum is ${a + b}.&lt;/code&gt;);  // Output: The sum is 15.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;You can even call functions:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;const name = 'Elayaraj';&lt;br&gt;
const upper =&lt;/code&gt;Hello, ${name.toUpperCase()}!&lt;code&gt;;&lt;br&gt;
console.log(upper);  // Output: Hello, ELAYARAJ!&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Advanced: Tagged Template Literals&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;You can also create tagged templates — special functions that process template literals.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Example:&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;`function tag(strings, value) {&lt;br&gt;
  return strings[0] + value.toUpperCase() + strings[1];&lt;br&gt;
}&lt;/p&gt;

&lt;p&gt;const name = 'Elayaraj';&lt;br&gt;
const result = tag&lt;code&gt;Hello, ${name}!&lt;/code&gt;;&lt;br&gt;
console.log(result);  // Output: Hello, ELAYARAJ!&lt;br&gt;
`&lt;br&gt;
This is useful for advanced use cases like custom formatting or internationalization.&lt;br&gt;
&lt;strong&gt;Final Thoughts&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Template literals are a game-changer for writing clean, dynamic, and maintainable JavaScript code.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Easier string interpolation&lt;/li&gt;
&lt;li&gt;Native multi-line support&lt;/li&gt;
&lt;li&gt;Embedded expressions&lt;/li&gt;
&lt;li&gt;Extendable with tags&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;What is the DOM?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The DOM stands for Document Object Model.&lt;br&gt;
It’s a programming interface that represents your HTML page as a tree of objects.&lt;/p&gt;

&lt;p&gt;Imagine your HTML like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;&amp;lt;html&amp;gt;
  &amp;lt;body&amp;gt;
    &amp;lt;h1&amp;gt;Welcome!&amp;lt;/h1&amp;gt;
    &amp;lt;p&amp;gt;This is a blog post.&amp;lt;/p&amp;gt;
  &amp;lt;/body&amp;gt;
&amp;lt;/html&amp;gt;

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

&lt;/div&gt;



&lt;p&gt;The browser turns this into a tree where:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Each tag (like &lt;h1&gt; or &lt;/h1&gt;
&lt;p&gt;) is a node.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;The whole page becomes a structured object JavaScript can access and manipulate.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;In short: &lt;strong&gt;The DOM is how JavaScript “sees” and interacts with the web page.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Why is the DOM Important?&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;It lets you read page content&lt;/li&gt;
&lt;li&gt;It lets you change what’s displayed dynamically&lt;/li&gt;
&lt;li&gt;It lets you respond to user actions (like clicks, form input, etc.)
Without the DOM, your JavaScript could not connect to the visual part of your website.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;Common DOM Operations&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;1️) Selecting Elements&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;You can grab elements from the page using:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;document.getElementById('myId');
document.querySelector('.myClass');
document.querySelectorAll('p');

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

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Example:&lt;/strong&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 title = document.getElementById('title');

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

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;2️)Changing Content&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;You can modify what’s shown on the page:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;title.textContent = 'New Heading';
title.innerHTML = '&amp;lt;span&amp;gt;New Heading&amp;lt;/span&amp;gt;';

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

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;textContent → just the text&lt;/li&gt;
&lt;li&gt;innerHTML → includes HTML markup&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;3️)Changing Styles&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;You can directly change styles:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;title.style.color = 'blue';
title.style.fontSize = '2em';

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

&lt;/div&gt;



&lt;p&gt;Or, for better practice, toggle CSS classes:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;title.classList.add('highlight');
title.classList.remove('hidden');
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;4️) Handling Events&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;You can make the page respond to user actions:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const button = document.querySelector('button');
button.addEventListener('click', () =&amp;gt; {
  alert('Button clicked!');
});
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This is how you create interactive web apps.&lt;br&gt;
&lt;strong&gt;How the DOM + JavaScript Work Together&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Think of JavaScript as the brain and the DOM as the body.&lt;br&gt;
The JavaScript reads, updates, and controls the DOM to make your web page come alive.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Some real-world uses:&lt;/li&gt;
&lt;li&gt;Show or hide elements&lt;/li&gt;
&lt;li&gt;Load dynamic content&lt;/li&gt;
&lt;li&gt;Validate forms&lt;/li&gt;
&lt;li&gt;Build animations and effects&lt;/li&gt;
&lt;li&gt;Create single-page apps (SPAs)&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>javascript</category>
      <category>html</category>
    </item>
    <item>
      <title>🌿 Understanding Spring, Spring Boot, IoC, and DI 🎨 What is MVC?</title>
      <dc:creator>Elayaraj C</dc:creator>
      <pubDate>Wed, 28 May 2025 16:07:10 +0000</pubDate>
      <link>https://dev.to/elayaraj31/understanding-spring-spring-boot-ioc-and-di-what-is-mvc-428f</link>
      <guid>https://dev.to/elayaraj31/understanding-spring-spring-boot-ioc-and-di-what-is-mvc-428f</guid>
      <description>&lt;p&gt;&lt;strong&gt;🌱 What is Spring?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Spring is a popular Java framework that helps you build powerful applications easily.&lt;/p&gt;

&lt;p&gt;Imagine you’re building a house (your application). You could do everything yourself — mix the cement, lay the bricks, install the pipes — or you could use tools and workers to make the job easier.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Spring gives you:&lt;/strong&gt;&lt;br&gt;
✅ Tools&lt;br&gt;
✅ Ready-made components&lt;br&gt;
✅ A way to organize everything cleanly&lt;/p&gt;

&lt;p&gt;With Spring, you can build:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Web applications&lt;/li&gt;
&lt;li&gt;Backend services&lt;/li&gt;
&lt;li&gt;Cloud apps&lt;/li&gt;
&lt;li&gt;Microservices&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Spring helps manage your app’s pieces (called beans) and how they talk to each other — saving you from writing repetitive or messy code.&lt;br&gt;
&lt;strong&gt;⚡ What is Spring Boot?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Spring Boot is like Spring on steroids.&lt;/p&gt;

&lt;p&gt;Normally, when you use Spring, you have to:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Write a lot of configuration&lt;/li&gt;
&lt;li&gt;Set up servers&lt;/li&gt;
&lt;li&gt;Connect all the pieces manually&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Spring Boot &lt;strong&gt;does most of this for you.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;With Spring Boot, you get:&lt;br&gt;
✅ Automatic configuration&lt;br&gt;
✅ Embedded servers (like Tomcat) — just run java -jar&lt;br&gt;
✅ Faster project setup with starters&lt;br&gt;
✅ Easy monitoring with tools like Actuator&lt;/p&gt;

&lt;p&gt;In short, Spring Boot makes it super easy to start and run Spring applications — especially for microservices or web apps.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;🧩 What is IoC (Inversion of Control)?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;This sounds fancy, but it’s really about who controls what.&lt;/p&gt;

&lt;p&gt;Normally, in regular Java:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Car car = new Car();
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Your code controls how the Car is created.&lt;/p&gt;

&lt;p&gt;With IoC, you let Spring control the creation:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;You tell Spring: “Hey, I need a Car.”&lt;/li&gt;
&lt;li&gt;Spring gives you the ready-made Car.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;This inversion (letting the framework handle creation) is called Inversion of Control.&lt;/p&gt;

&lt;p&gt;Why is this useful?&lt;br&gt;
✅ You don’t have to manually manage complex object creation&lt;br&gt;
✅ It keeps your code clean and flexible&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;🔗 What is DI (Dependency Injection)?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Dependency Injection is how IoC works.&lt;/p&gt;

&lt;p&gt;Let’s say your Car needs an Engine.&lt;/p&gt;

&lt;p&gt;Without DI:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Engine engine = new Engine();
Car car = new Car(engine);

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

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;With DI:&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;
@Component
public class Car {
    @Autowired
    private Engine engine;
}

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

&lt;/div&gt;



&lt;p&gt;You don’t create the Engine yourself — Spring injects it for you.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Benefits:&lt;/strong&gt;&lt;br&gt;
✅ Less coupling (classes don’t tightly depend on each other)&lt;br&gt;
✅ Easier testing (you can inject mock objects)&lt;br&gt;
✅ Better maintainability&lt;/p&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%2Fwodq8cprgmanj4otv31h.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%2Fwodq8cprgmanj4otv31h.png" alt="Image description" width="800" height="306"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;
  
  
  🎨 What is MVC?
&lt;/h2&gt;

&lt;p&gt;MVC stands for Model - View - Controller.&lt;br&gt;
It’s a design pattern used to organize code in web applications (and even desktop apps) to make things cleaner, more modular, and easier to maintain.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;🏗 Breakdown of MVC&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;✅ Model → the data + business logic&lt;br&gt;
✅ View → what the user sees (UI)&lt;br&gt;
✅ Controller → handles user input and connects Model + View&lt;/p&gt;

&lt;p&gt;Let’s go one by one.&lt;br&gt;
&lt;strong&gt;📦 Model&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Represents the data and rules of your application.&lt;/li&gt;
&lt;li&gt;It’s where you define things like:&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;1) What’s a &lt;strong&gt;User&lt;/strong&gt;? What fields does it have?&lt;br&gt;
2) How do you get data from the database?&lt;br&gt;
3) What business rules apply?&lt;br&gt;
&lt;strong&gt;Example:&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;code&gt;public class User {&lt;br&gt;
    private String name;&lt;br&gt;
    private String email;&lt;br&gt;
    // getters, setters, validation, etc.&lt;br&gt;
}&lt;br&gt;
&lt;/code&gt;&lt;br&gt;
&lt;strong&gt;🎨 View&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;This is the front-end, the part users interact with.&lt;/li&gt;
&lt;li&gt;In web apps, it’s usually HTML, CSS, maybe with some JavaScript.&lt;/li&gt;
&lt;li&gt;It shows the data from the model.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Example:&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;code&gt;&amp;lt;h1&amp;gt;Welcome, ${user.name}!&amp;lt;/h1&amp;gt;&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;🕹 Controller&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;The brain that handles user actions.&lt;/li&gt;
&lt;li&gt;It receives input (like a button click or form submission), talks to the Model, and decides which View to show.&lt;/li&gt;
&lt;/ul&gt;

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

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;@Controller
public class UserController {
    @GetMapping("/profile")
    public String getProfile(Model model) {
        User user = userService.getCurrentUser();
        model.addAttribute("user", user);
        return "profile";
    }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;🛠 How they work together&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;1️⃣ User clicks a button or enters a URL →&lt;br&gt;
2️⃣ Controller handles the request, calls the Model →&lt;br&gt;
3️⃣ Model returns data →&lt;br&gt;
4️⃣ Controller passes data to the View →&lt;br&gt;
5️⃣ View renders the final HTML to the user&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;🌟 Why use MVC?&lt;/strong&gt;&lt;br&gt;
✅ Separates concerns → keeps code clean&lt;br&gt;
✅ Easier to maintain → change one part without breaking others&lt;br&gt;
✅ More testable → you can test logic without UI&lt;br&gt;
✅ Works well for teams → backend + frontend developers can work separately&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;🚀 In Spring Boot&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Spring Boot uses Spring MVC to build web apps.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;It automatically connects:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Model → your Java classes + services&lt;/li&gt;
&lt;li&gt;View → templates like Thymeleaf, JSP, or HTML&lt;/li&gt;
&lt;li&gt;Controller → annotated with @Controller or @RestController&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>springboot</category>
      <category>spring</category>
    </item>
    <item>
      <title>Understanding JavaScript Data Types day 1</title>
      <dc:creator>Elayaraj C</dc:creator>
      <pubDate>Wed, 28 May 2025 15:40:25 +0000</pubDate>
      <link>https://dev.to/elayaraj31/understanding-javascript-data-types-day-1-24b0</link>
      <guid>https://dev.to/elayaraj31/understanding-javascript-data-types-day-1-24b0</guid>
      <description>&lt;p&gt;&lt;strong&gt;🌟 Two Main Categories&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;JavaScript divides data types into two broad groups:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;1️⃣ Primitive types (simple, immutable values)&lt;/strong&gt;&lt;br&gt;
&lt;strong&gt;2️⃣ Non-primitive types (objects, complex structures)&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Let’s go through them.&lt;br&gt;
&lt;strong&gt;🔹 Primitive Data Types&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;These are the most basic types — they hold a single value and are immutable (cannot be changed).&lt;br&gt;
&lt;strong&gt;✅ Number&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;For any numeric value, including decimals.&lt;/p&gt;

&lt;p&gt;&lt;code&gt;let age = 25;&lt;br&gt;
let price = 99.99;&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;✅ String&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;For text, wrapped in single ' or double " quotes.&lt;/p&gt;

&lt;p&gt;&lt;code&gt;let name = "Elayaraj";&lt;br&gt;
let message = 'Hello, world!';&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;✅ Boolean&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;True or false — used for logic and conditions.&lt;/p&gt;

&lt;p&gt;&lt;code&gt;let isActive = true;&lt;br&gt;
let hasAccess = false;&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;✅ Undefined&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;A variable that has been declared but not assigned a value.&lt;/p&gt;

&lt;p&gt;&lt;code&gt;let result;&lt;br&gt;
console.log(result); // undefined&lt;br&gt;
&lt;/code&gt;&lt;br&gt;
&lt;strong&gt;✅ Null&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;An intentional empty value.&lt;/p&gt;

&lt;p&gt;&lt;code&gt;let user = null;&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;✅ Symbol&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;A unique and immutable value, often used as an object key (advanced use).&lt;/p&gt;

&lt;p&gt;&lt;code&gt;let id = Symbol("uniqueId");&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;✅ BigInt&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;For very large integers beyond Number limits.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let bigNumber = 123456789012345678901234567890n;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;🔹 Non-Primitive Data Types&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;These hold collections of values and are mutable.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;✅ Object&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;A collection of key-value pairs.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let person = {
  name: "Elayaraj",
  age: 25
};
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;✅ Array&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;An ordered list of values (technically an object).&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let fruits = ["apple", "banana", "cherry"];
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;✅ Function&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;A reusable block of code (also a type of object).&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;function greet() {
  console.log("Hello!");
}

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

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;🧠 Why Does This Matter?&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Understanding data types helps you:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Write bug-free code (no type errors)&lt;/li&gt;
&lt;li&gt;Use correct operations (e.g., adding numbers vs. concatenating strings)&lt;/li&gt;
&lt;li&gt;Master type conversions (e.g., turning strings into numbers)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;For example:&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;let x = "5" + 2;  // "52" (string concatenation)
let y = "5" - 2;  // 3   (number subtraction)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;🔍 Type Checking&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;You can check a value’s type using:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;typeof 42;        // "number"
typeof "hello";   // "string"
typeof true;      // "boolean"
typeof null;      // "object" (this is a known quirk!)
typeof [];        // "object"
typeof function() {}; // "function"

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

&lt;/div&gt;



</description>
      <category>javascript</category>
    </item>
  </channel>
</rss>
