Het eenvoudigste webproject maken in IntelliJ IDEA Enterprise. Stap voor stap, met foto's

Kennis die nodig is om het artikel te begrijpen: U heeft Java Core al min of meer door en wilt JavaEE-technologieën en webprogrammering bekijken . Het zou voor u het meest logisch zijn om momenteel de Java Collections-zoektocht te bestuderen, die onderwerpen behandelt die dicht bij het artikel staan. Momenteel gebruik ik IntelliJ IDEA Enterprise Edition ( noot van de redactie: dit is een betaalde uitgebreide versie van de IDE; deze wordt meestal gebruikt bij professionele ontwikkeling). Het is veel gemakkelijker om met webprojecten erin te werken dan in de gratis Community-editie . In de Enterprise-editie bouwt u met letterlijk één muisklik het project op, plaatst u het in een servletcontainer, start u de server en opent u zelfs een webpagina voor het project in de browser. In de gratis versie van IDEA zou u dit grotendeels zelf moeten doen, dus "handmatig". Ik gebruik Apache Mavenom het project op te bouwen en de levenscyclus ervan te beheren. Ik heb in dit project slechts een klein deel van zijn mogelijkheden (pakket-/afhankelijkheidsbeheer) gebruikt. Als servletcontainer/applicatieserver koos ik Apache Tomcat versie 9.0.12.

Laten we beginnen

Open eerst IntelliJ IDEA en maak een leeg Maven-project aan . Selecteer aan de linkerkant Maven en controleer of de JDK van het project hierboven is geselecteerd. Als het er niet is, selecteert u er een uit de lijst of klikt u op Nieuw ... en kiest u er een uit de computer. In dit venster moet u de GroupId en ArtifactId specificeren . De GroupId verwijst naar de unieke identificatie van het bedrijf dat het project uitgeeft. Het is gebruikelijk om de domeinnaam van het bedrijf te gebruiken, maar dan in omgekeerde volgorde. Maar niet als een spiegel. Als de domeinnaam van een bedrijf bijvoorbeeld maven.apache.org is , dan is de GroupId org.apache.maven. Dat wil zeggen, we schrijven eerst het domein op het hoogste niveau, voegen een punt toe, dan het domein op het tweede niveau, enzovoort. Dit is de algemeen aanvaarde benadering. Als je het project zelf "uitslijpt" (en niet als onderdeel van een bedrijf), dan zet je hier je persoonlijke domeinnaam (ook in omgekeerde volgorde!). Als je er een hebt natuurlijk. :) Zo niet, maak je geen zorgen. Je kunt hier eigenlijk alles schrijven . In dit voorbeeld gebruik ik een fictief domein: fatlady.info.codegym.cc . Dienovereenkomstig voer ik cc.codergym.info.fatlady in het veld GroupId in . ArtifactId is gewoon de naam van ons project. U kunt letters en bepaalde symbolen (bijvoorbeeld koppeltekens) gebruiken om woorden van elkaar te scheiden. Ons "artefact" zal precies de naam krijgen die we hier schrijven. In dit voorbeeld ga ik my-super-project gebruiken . Raak het versieveld nog niet aan - laat het gewoon zoals het is. En hier is het standaard IDEA-venster wanneer u een nieuw project maakt. Traditiegetrouw laten we het mijn-superproject noemen . Het project is gemaakt! We zien dat het nu de exacte gegevens bevat die we hebben ingevoerd bij het maken van het Maven-project : groupId , artifactId en version (we hebben die laatste niet aangeraakt).

De structuur van ons project

Dit Maven-project heeft een specifieke structuur. Zoals je kunt zien, heeft de root:

• een .idea- directory, die de IDEA-instellingen van het huidige project bevat;
• een src- directory, waar we onze broncode maken;
• een my-super-project.iml- bestand, een projectbestand gemaakt door IDEA;
• het pom.xml- bestand (het Maven-projectbestand dat ik eerder noemde), dat nu open is. Als ik ergens pom.xml vermeld, is dit het bestand waar ik het over heb.

In de map src zijn er twee submappen:

• main — voor onze code;
• test — voor het testen van onze code.

In main en test is er een java- map. U kunt deze als dezelfde map beschouwen, behalve dat de hoofdmap voor de broncode is en de testmap voor de testcode. Voorlopig hebben we geen gebruik van de bronnenmap . We zullen het niet gebruiken. Maar laat het daar gewoon bij.

Het omzetten in een webproject

Het wordt tijd dat we ons Maven-project omzetten in een webproject. Om dit te doen, klikt u met de rechtermuisknop op de projectnaam in deze boomstructuur en selecteert u Kaderondersteuning toevoegen … Er wordt een venster geopend waarin we ondersteuning voor verschillende kaders aan ons project kunnen toevoegen. Maar we hebben er maar één nodig: Web Applicatie . En dat is degene die we selecteren. Zorg ervoor dat het selectievakje Webtoepassing is ingeschakeld en dat het hoofdvenster aangeeft dat we automatisch een web.xml- bestand willen maken (ik raad aan het selectievakje in te schakelen, als dit nog niet is geselecteerd). We zien dan dat de webmap is toegevoegd aan onze projectstructuur. Dit is de root van ons webproject met het adres/. Met andere woorden, als we ' localhost ' invoeren in de browser (wanneer het project draait natuurlijk), dan zal het hier kijken, naar de root van het webproject. Als we localhost/addUser invoeren , zoekt het naar een bron met de naam addUser in de webmap . In web is er een vereiste map met de naam WEB-INF , waar het bestand web.xml zich bevindt, dat wil zeggen degene die we het programma in de laatste stap hebben gevraagd te maken. Laten we het openen. Je kunt zien dat er nog niets interessants in zit, alleen een koptekst. Trouwens, als je niet hebt gevraagd om het bestand aan te maken, dan moet je het handmatig maken, dwz alle headers met de hand typen. Of zoek in ieder geval naar een kant-en-klare versie op internet. Waar hebben we web.xml voor nodig? Voor het in kaart brengen. Hier zullen we voor Tomcat aangeven welke URL-verzoeken moeten worden doorgegeven aan welke servlets. Maar daar komen we later op terug. Laat het voorlopig leeg. De webmap heeft ook een bestand index.jsp. Open het. Dit is het bestand dat als het ware standaard wordt uitgevoerd. Met andere woorden, het is precies wat we zullen zien als we aan het project beginnen. Kortom, jsp is een gewoon HTML-bestand , behalve dat je er Java-code in kunt uitvoeren.

Een klein beetje over statische en dynamische inhoud

Statische inhoud is inhoud die in de loop van de tijd niet verandert. Alles wat we in een HTML-bestand schrijven, wordt ongewijzigd weergegeven, precies zoals het is geschreven. Als we " hallo wereld " schrijven , wordt deze tekst weergegeven zodra we de pagina openen, en over 5 minuten, en morgen, en over een week, en over een jaar. Het zal niet veranderen. Maar wat als we de huidige datum op de pagina willen weergeven? Als we gewoon schrijven " 27 oktober 2017", dan zouden we morgen dezelfde datum zien, en een week later, en een jaar later. Maar we willen graag dat de datum actueel is. Dit is waar de mogelijkheid om code direct op de pagina uit te voeren nuttig is. We kunnen een date-object, converteer het naar het gewenste formaat en geef het weer op de pagina. Elke dag dat we de pagina openen, is de datum altijd actueel. Als we alleen statische inhoud nodig hebben, hebben we alleen een gewone webserver nodig en HTML-bestanden. We hebben geen Java, Maven of Tomcat nodig. Maar als we dynamische inhoud willen gebruiken, hebben we al die tools nodig. Maar laten we nu teruggaan naar onze index.jsp . Laten we iets anders dan de standaardtitel aangeven, bijvoorbeeld " Mijn superweb-app! " Laten we dan in de hoofdtekst schrijven: " Ik leef! " We zijn bijna klaar om ons project te starten! Helaas is de gebruikelijke groene driehoek voor het starten van het programma niet actief. Klik op de knop links ervan (aangegeven op het scherm met een rode pijl) en selecteer Configuraties bewerken ... Dat opent een venster waarin we worden uitgenodigd om op een groen plusteken te klikken om wat configuratie toe te voegen. Klik erop (in de linkerbovenhoek van het venster). Kies Tomcat-server > Lokaal . Er wordt een venster geopend met veel opties, maar de standaardinstellingen passen bij ons voor bijna alles. We kunnen onze configuratie een mooie naam geven in plaats van de standaard Naamloos (helemaal bovenaan). We moeten ook verifiëren dat IDEA Tomcat met succes op ons systeem heeft gevonden (je hebt het al gedownload en geïnstalleerdhet toch?). Als het niet is gevonden (wat onwaarschijnlijk is), druk dan op de pijl-omlaag en kies waar het is geïnstalleerd. Of kies een andere versie, als je er meer dan één hebt geïnstalleerd. Ik heb er maar één en die is al geïnstalleerd. Daarom ziet het er uit zoals op mijn scherm. En helemaal onderaan het venster zien we een waarschuwing die ons waarschuwt dat er tot nu toe geen artefacten zijn aangegeven voor implementatie op de server. Rechts van deze waarschuwing staat een knop die suggereert dat we dit moeten oplossen. We klikken erop en zien dat IDEA alles zelf heeft kunnen vinden, alles wat ontbreekt zelf heeft gemaakt en alle instellingen zelf heeft geconfigureerd. We kunnen zien dat het ons heeft verplaatst van het tabblad Server naar het tabblad Implementatie , onder Implementeren bij het opstarten van de serversectie, en we hebben nu een artefact om in te zetten. Klik op Toepassen en OK. En we zien eerst dat er onderaan het venster een sectie is verschenen met onze lokale Tomcat-server, waar ons artefact zal worden geplaatst. Vouw dit gedeelte samen door op de overeenkomstige knop aan de rechterkant van het venster te klikken. Nu zien we dat de groene lanceerdriehoek actief is. Voor degenen die graag alles dubbel willen controleren, kun je op de knop Projectinstellingen klikken (rechts van de startknoppen, aangegeven met een rode pijl), naar het gedeelte Artefacten gaan en ervoor zorgen dat het artefact echt is gemaakt. Het was er niet totdat we op die Fix druktenknop, maar nu is alles in orde. En deze configuratie past perfect bij ons. In een notendop, het verschil tussen my-super-project:war en my-super-project:war exploded is dat my-super-project:war uit slechts één war- bestand bestaat (wat slechts een archief is) en de versie met exploded is gewoon de "uitgepakte" oorlog . En persoonlijk vind ik die optie handiger, omdat je hiermee snel kleine wijzigingen op de server kunt debuggen. In wezen is het artefact ons project, zojuist gecompileerd - en waar een mappenstructuur is gewijzigd om Tomcat er rechtstreeks toegang toe te geven. Het zal er ongeveer zo uitzien: Nu is alles klaar om ons project te lanceren. Druk op de kostbare groene startknop en geniet van het resultaat! :)