{"id":2915,"date":"2026-01-20T06:14:25","date_gmt":"2026-01-20T06:14:25","guid":{"rendered":"https:\/\/codeinsightacademy.com\/blog\/?p=2915"},"modified":"2026-01-21T05:18:54","modified_gmt":"2026-01-21T05:18:54","slug":"jsp-in-vscode","status":"publish","type":"post","link":"https:\/\/codeinsightacademy.com\/blog\/c-programming\/jsp-in-vscode\/","title":{"rendered":"JSP in vscode"},"content":{"rendered":"\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h1>JSP Development using Maven &amp; VS Code (Step-by-Step)<\/h1>\n\n\n\n<p>This guide explains how to <strong>create, configure, and run a JSP project<\/strong> using <strong>Maven<\/strong>, <strong>VS Code (Antigravity)<\/strong>, and <strong>embedded Tomcat<\/strong>, without manually copying WAR files.<\/p>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2>1\ufe0f\u20e3 Prerequisites<\/h2>\n\n\n\n<p>Make sure the following are installed:<\/p>\n\n\n\n<ul><li><strong>Java JDK 8 or above<\/strong><\/li><li><strong>Apache Maven<\/strong><\/li><li><strong>VS Code \/ Antigravity<\/strong><\/li><li>VS Code Extensions:<ul><li>Extension Pack for Java<\/li><li>Maven for Java<\/li><\/ul><\/li><\/ul>\n\n\n\n<p>Verify from terminal:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>java -version\nmvn -version\n<\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2>2\ufe0f\u20e3 Create Maven Web Project (JSP)<\/h2>\n\n\n\n<p>Run the following command in terminal:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>mvn archetype:generate \\\n-DgroupId=com.cia \\\n-DartifactId=jsp-demo \\\n-DarchetypeArtifactId=maven-archetype-webapp \\\n-DinteractiveMode=false\n<\/code><\/pre>\n\n\n\n<p>This creates a standard <strong>Maven Web Application<\/strong> structure.<\/p>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2>3\ufe0f\u20e3 Project Structure<\/h2>\n\n\n\n<p>After creation, the folder structure will look like this:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>jsp-demo\/\n \u251c\u2500\u2500 pom.xml\n \u2514\u2500\u2500 src\/\n     \u2514\u2500\u2500 main\/\n         \u2514\u2500\u2500 webapp\/\n             \u2514\u2500\u2500 index.jsp\n<\/code><\/pre>\n\n\n\n<ul><li><code>index.jsp<\/code> \u2192 entry point of the JSP application<\/li><li><code>pom.xml<\/code> \u2192 Maven configuration file<\/li><\/ul>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2>4\ufe0f\u20e3 Configure <code>pom.xml<\/code><\/h2>\n\n\n\n<p>Replace \/ update <code>pom.xml<\/code> with the following configuration:<\/p>\n\n\n\n<h3>Key Points:<\/h3>\n\n\n\n<ul><li>Packaging type is <code>war<\/code><\/li><li>Updated <code>maven-war-plugin<\/code><\/li><li>Embedded Tomcat using <code>tomcat7-maven-plugin<\/code><\/li><li>Port changed to <strong>8081<\/strong> to avoid conflict<\/li><\/ul>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;project xmlns=\"http:\/\/maven.apache.org\/POM\/4.0.0\" xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\"\n  xsi:schemaLocation=\"http:\/\/maven.apache.org\/POM\/4.0.0 http:\/\/maven.apache.org\/maven-v4_0_0.xsd\"&gt;\n  &lt;modelVersion&gt;4.0.0&lt;\/modelVersion&gt;\n  &lt;groupId&gt;com.cia&lt;\/groupId&gt;\n  &lt;artifactId&gt;demo&lt;\/artifactId&gt;\n  &lt;packaging&gt;war&lt;\/packaging&gt;\n  &lt;version&gt;1.0-SNAPSHOT&lt;\/version&gt;\n  &lt;name&gt;demo Maven Webapp&lt;\/name&gt;\n  &lt;url&gt;http:\/\/maven.apache.org&lt;\/url&gt;\n  \n  &lt;dependencies&gt;\n    &lt;dependency&gt;\n        &lt;groupId&gt;com.mysql&lt;\/groupId&gt;\n        &lt;artifactId&gt;mysql-connector-j&lt;\/artifactId&gt;\n        &lt;version&gt;8.0.33&lt;\/version&gt;\n    &lt;\/dependency&gt;\n&lt;\/dependencies&gt;\n\n  &lt;build&gt;\n    &lt;finalName&gt;demo&lt;\/finalName&gt;\n&lt;plugins&gt;\n    &lt;!-- WAR Plugin (updated for modern Java) --&gt;\n      &lt;plugin&gt;\n        &lt;groupId&gt;org.apache.maven.plugins&lt;\/groupId&gt;\n        &lt;artifactId&gt;maven-war-plugin&lt;\/artifactId&gt;\n        &lt;version&gt;3.4.0&lt;\/version&gt;\n      &lt;\/plugin&gt;\n\n      &lt;!-- Embedded Tomcat --&gt;\n      &lt;plugin&gt;\n        &lt;groupId&gt;org.apache.tomcat.maven&lt;\/groupId&gt;\n        &lt;artifactId&gt;tomcat7-maven-plugin&lt;\/artifactId&gt;\n        &lt;version&gt;2.2&lt;\/version&gt;\n        &lt;configuration&gt;\n          &lt;path&gt;\/jsp-demo&lt;\/path&gt;\n          &lt;port&gt;8081&lt;\/port&gt;\n        &lt;\/configuration&gt;\n      &lt;\/plugin&gt;\n\n    &lt;\/plugins&gt;\n  &lt;\/build&gt;\n&lt;\/project&gt;\n\n<\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2>5\ufe0f\u20e3 Sample <code>index.jsp<\/code><\/h2>\n\n\n\n<p>Edit <code>src\/main\/webapp\/index.jsp<\/code>:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;html&gt;\n&lt;body&gt;\n    &lt;h2&gt;Hello World!&lt;\/h2&gt;\n\n    &lt;!-- Read number from query parameter and print square --&gt;\n\n    &lt;%\n        String num = request.getParameter(\"number\");\n        if (num != null) {\n            int x = Integer.parseInt(num);\n    %&gt;\n        &lt;p&gt;Square of &lt;%= x %&gt; is &lt;%= x * x %&gt;&lt;\/p&gt;\n    &lt;%\n        } else {\n    %&gt;\n        &lt;p&gt;Please pass number as query parameter&lt;\/p&gt;\n        &lt;p&gt;Example: ?number=5&lt;\/p&gt;\n    &lt;%\n        }\n    %&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;\n<\/code><\/pre>\n\n\n\n<h2>Sample 2<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;html&gt;\n&lt;body&gt;\n\n&lt;h2&gt;Read POST Parameter in JSP&lt;\/h2&gt;\n\n&lt;form method=\"post\" action=\"index.jsp\"&gt;\n    Enter number:\n    &lt;input type=\"text\" name=\"number\"&gt;\n    &lt;input type=\"submit\" value=\"Submit\"&gt;\n&lt;\/form&gt;\n\n&lt;%\n    String num = request.getParameter(\"number\");\n    if (num != null) {\n        int x = Integer.parseInt(num);\n%&gt;\n    &lt;p&gt;Square of &lt;%= x %&gt; is &lt;%= x * x %&gt;&lt;\/p&gt;\n&lt;%\n    }\n%&gt;\n\n&lt;\/body&gt;\n&lt;\/html&gt;\n<\/code><\/pre>\n\n\n\n<h2>Sample 3 with database connection<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;%@ page import=\"java.sql.*\" %>\n\n    &lt;% \nString url=\"jdbc:mysql:\/\/localhost:3306\/&lt;<strong>your_database_name<\/strong>>?useSSL=false&amp;serverTimezone=UTC\" ; \nString user=\"<strong>your_db_username<\/strong>\" ; \nString password=\"<strong>your_db_password<\/strong>\"; \nConnection con=null; \nStatement stmt=null; \nResultSet rs=null; \ntry {\n        Class.forName(\"com.mysql.cj.jdbc.Driver\"); \n        con=DriverManager.getConnection(url, user, password);\n        stmt=con.createStatement(); \n        rs=stmt.executeQuery(\"<strong>SELECT name FROM users<\/strong>\"); %>\n\n        &lt;h3>Users from DB:&lt;\/h3>\n        &lt;ul>\n            &lt;% while (rs.next()) { %>\n                &lt;li>\n                    &lt;%= rs.getString(\"name\") %>\n                &lt;\/li>\n            &lt;% } %>\n        &lt;\/ul>\n\n&lt;% } catch (Exception e) { %>\n            &lt;p style=\"color:red;\">\n                &lt;%= e.getMessage() %>\n            &lt;\/p>\n&lt;% } finally { \n        if (rs !=null) \n        rs.close(); \n        if (stmt !=null) stmt.close(); \n        if (con !=null) con.close(); \n} %><\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2>6\ufe0f\u20e3 Maven Build Commands (What &amp; Why)<\/h2>\n\n\n\n<h3>Clean old build files<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>mvn clean\n\nor\n\nmvn clean install\n<\/code><\/pre>\n\n\n\n<h3>Build WAR file<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>mvn package\n<\/code><\/pre>\n\n\n\n<p>or<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>mvn install\n<\/code><\/pre>\n\n\n\n<blockquote class=\"wp-block-quote\"><p>These commands generate a <code>.war<\/code> file inside the <code>target<\/code> directory.<\/p><\/blockquote>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2>7\ufe0f\u20e3 Run JSP Application (No WAR Copy Required)<\/h2>\n\n\n\n<p>Start embedded Tomcat using:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>mvn tomcat7:run\n<\/code><\/pre>\n\n\n\n<p>Tomcat will start on <strong>port 8081<\/strong>.<\/p>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2>8\ufe0f\u20e3 Access Application in Browser<\/h2>\n\n\n\n<p>Open browser and visit:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>http:&#47;&#47;localhost:8081\/jsp-demo\/\n<\/code><\/pre>\n\n\n\n<p>For query parameter example:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>http:&#47;&#47;localhost:8081\/jsp-demo\/index.jsp?number=5\n<\/code><\/pre>\n\n\n\n<h3>Output:<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>Square of 5 is 25\n<\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2>9\ufe0f\u20e3 Important Notes for Students<\/h2>\n\n\n\n<ul><li>JSP <strong>cannot run directly<\/strong> in browser<\/li><li>JSP needs a <strong>Servlet Container (Tomcat)<\/strong><\/li><li>WAR files are <strong>deployed<\/strong>, not executed<\/li><li>Embedded Tomcat is ideal for:<ul><li>learning<\/li><li>development<\/li><li>quick demos<\/li><\/ul><\/li><\/ul>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2>10\ufe0f\u20e3 Common Mistakes to Avoid<\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th>Mistake<\/th><th>Reason<\/th><\/tr><\/thead><tbody><tr><td>Using Live Server<\/td><td>JSP not supported<\/td><\/tr><tr><td>Using <code>&lt;%! %&gt;<\/code> for request<\/td><td>Causes compilation error<\/td><\/tr><tr><td>Running <code>.war<\/code> file<\/td><td>WAR is not executable<\/td><\/tr><tr><td>Port 8080 conflict<\/td><td>Use 8081 or higher<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2>11\ufe0f\u20e3 Summary<\/h2>\n\n\n\n<ul><li>Maven manages project structure &amp; dependencies<\/li><li>Tomcat Maven Plugin runs JSP without manual deployment<\/li><li>VS Code + Maven is lightweight and industry-relevant<\/li><li>Best approach for learning JSP fundamentals<\/li><\/ul>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n","protected":false},"excerpt":{"rendered":"<p>JSP Development using Maven &amp; VS Code (Step-by-Step) This guide explains how to create, configure, and run a JSP project using Maven, VS Code (Antigravity), and embedded Tomcat, without manually copying WAR files. 1\ufe0f\u20e3 Prerequisites Make sure the following are installed: Java JDK 8 or above Apache Maven VS Code \/ Antigravity VS Code Extensions: [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[1],"tags":[],"_links":{"self":[{"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/posts\/2915"}],"collection":[{"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/comments?post=2915"}],"version-history":[{"count":7,"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/posts\/2915\/revisions"}],"predecessor-version":[{"id":2930,"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/posts\/2915\/revisions\/2930"}],"wp:attachment":[{"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/media?parent=2915"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/categories?post=2915"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/codeinsightacademy.com\/blog\/wp-json\/wp\/v2\/tags?post=2915"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}