JavaRush /Java Blog /Random-TL /Paglikha ng isang simpleng proyekto sa web sa IntelliJ Id...

Paglikha ng isang simpleng proyekto sa web sa IntelliJ Idea Enterprise. Hakbang-hakbang, na may mga larawan

Nai-publish sa grupo
Antas ng kaalaman na kinakailangan upang maunawaan ang artikulo: higit pa o hindi gaanong naunawaan mo na ang Java Core at gusto mong tingnan ang mga teknolohiya ng JavaEE at web programming. Ito ang pinakamahalaga kung kasalukuyan mong pinag-aaralan ang Java Collections quest, na sumasaklaw sa mga paksang malapit sa artikulo. Paglikha ng isang simpleng proyekto sa web sa IntelliJ Idea Enterprise.  Hakbang-hakbang, na may mga larawan - 1Kasalukuyan akong gumagamit ng IntelliJ IDEA Enterprise Edition (ito ay isang bayad na advanced na bersyon ng IDE, kadalasang ginagamit ito sa propesyonal na pag-unlad - tala ng editor ). Mas madaling magtrabaho sa mga proyekto sa web kaysa sa libreng Community Edition. Kaya, sa Enterprise Edition, literal sa isang pag-click ng mouse, ang proyekto ay binuo, ibinuhos sa isang lalagyan ng servlet, magsisimula ang server, at kahit isang pahina na may tumatakbong proyekto ay bubukas sa browser. Sa libreng bersyon ng ideya, karamihan sa mga ito ay kailangang gawin nang nakapag-iisa, wika nga, "sa pamamagitan ng kamay." Ginagamit ko ang Apache Maven para buuin ang proyekto at pamahalaan ang lifecycle nito. Dito ko ginamit lamang ang isang maliit na bahagi ng mga kakayahan nito (package/dependency management). Pinili ko ang bersyon ng Apache Tomcat 9.0.0.M4 bilang servlet container/Application server. Alam kong mayroon nang mga mas bagong bersyon, ngunit ito ang na-install ko.

Magsimula na tayo

Una, buksan natin ang IntelliJ IDEA at lumikha ng walang laman na proyekto ng Maven.
Paglikha ng isang simpleng proyekto sa web sa IntelliJ Idea Enterprise.  Hakbang-hakbang, na may mga larawan - 2
Dito sa kaliwa pipiliin namin ang Maven, tingnan kung ang JDK para sa proyekto ay nakasaad sa itaas. Kung wala ito, piliin ang kailangan mo mula sa listahan, o i-click ang Bago... at direktang pumili mula sa iyong computer. Sa gitna ng window mayroon akong animation ng paglo-load ng listahan ng mga archetypes. Hindi namin kailangan ang mga ito, kaya nang hindi naghihintay ng pag-download, huwag mag-atubiling i-click ang Susunod sa ibaba ng window.
Paglikha ng isang simpleng proyekto sa web sa IntelliJ Idea Enterprise.  Hakbang-hakbang, na may mga larawan - 3
Sa window na ito kailangan mong tukuyin ang GroupId at ArtifactId . Ang GroupId ay tumutukoy sa natatanging identifier ng kumpanya na gumagawa ng proyekto. Karaniwang kasanayan ang paggamit ng domain name ng kumpanya, ngunit sa reverse order. Hindi sa kahulugan ng salamin, ngunit kung, halimbawa, ang domain name ng isang kumpanya ay maven.apache.org , ang GroupId nito ay org.apache.maven . Iyon ay, isulat muna namin ang unang antas ng domain, paghiwalayin ito ng isang tuldok, isulat ang pangalan ng pangalawang antas na domain, at iba pa. Ito ang pangkalahatang tinatanggap na diskarte. Kung sakaling ikaw ay "pumuputol" ng isang proyekto nang mag-isa, at hindi bilang bahagi ng isang kumpanya, isulat ang iyong personal na domain name dito (sa reverse order din!). Kung meron ka, syempre :). Kung hindi, huwag kang magalit. Sa katunayan, maaari kang magsulat ng kahit ano dito .
Para sa isang kumpanyang may domain name na vasya.pupkin.org, ang GroupId ay magiging org.pupkin.vasya. Ang diskarte na ito sa mga pangalan ay kailangan upang paghiwalayin ang mga proyekto na may parehong pangalan, ngunit inilabas ng iba't ibang kumpanya.
Sa halimbawang ito, gagamitin ko ang fictitious domain name na fatfaggy.info.javarush.ru . Alinsunod dito, ipinasok ko ang ru.javarush.info.fatfaggy sa field ng GroupId . Ang ArtefactId ay simpleng pangalan ng aming proyekto. Maaari kang gumamit ng mga titik at ilang simbolo (mga gitling, halimbawa) upang paghiwalayin ang mga salita. Ang aming "artifact" ay tatawaging eksakto tulad ng pagsusulat namin dito. Sa halimbawang ito, isinusulat ko ang aking-super-proyekto . Hindi namin hinawakan ang field ng bersyon sa ngayon, hinahayaan namin ito.
Paglikha ng isang simpleng proyekto sa web sa IntelliJ Idea Enterprise.  Hakbang-hakbang, na may mga larawan - 4
Well, ang karaniwang window ng IDEA kapag gumagawa ng bagong proyekto. Tawagin natin itong my-super-project ayon sa tradisyon .
Paglikha ng isang simpleng proyekto sa web sa IntelliJ Idea Enterprise.  Hakbang-hakbang, na may mga larawan - 5
Nagawa na ang proyekto!
Agad na bumukas ang pom.xml file sa harap namin. Ito ay isang file na may mga setting ng Maven. Kung gusto naming "sabihin" kay Maven kung ano at paano gagawin o kung saan kukuha ng isang bagay, inilalarawan namin ang lahat ng ito sa mismong pom.xml file na ito. Ito ay matatagpuan sa ugat ng proyekto.
Nakikita namin na naglalaman na ito ng eksaktong data na ipinasok namin noong nilikha ang proyekto ng Maven: groupId , artifactId at bersyon (hindi namin hinawakan ang huli).

Ang istraktura ng aming proyekto

Ang proyektong ito ng Maven ay may isang tiyak na istraktura.
Paglikha ng isang simpleng proyekto sa web sa IntelliJ Idea Enterprise.  Hakbang-hakbang, na may mga larawan - 6
Tulad ng nakikita natin, sa ugat ng kasinungalingan:
  • ang .idea directory , na naglalaman ng mga setting ng ideya para sa kasalukuyang proyekto;
  • ang direktoryo ng src kung saan nilikha namin ang aming mga mapagkukunan;
  • my-super-project.iml file , isang project file na ginawa ng IDEA;
  • pom.xml file , ang parehong Maven project file na binanggit ko sa itaas, na bukas na namin ngayon. Kung babanggitin ko ang pom.xml o "pom" sa isang lugar, ibig sabihin ko ang partikular na file na ito.
Ang src folder naman ay naglalaman ng dalawang subfolder:
  • pangunahing - para sa aming code;
  • pagsubok - para sa mga pagsubok para sa aming code.
Ang parehong pangunahing at pagsubok ay may isang java folder . Isaalang-alang na ang mga ito ay ang parehong folder, ang isa lamang sa pangunahing ay para sa source code, at ang isa sa pagsubok ay para sa pagsubok na code, ayon sa pagkakabanggit. Hindi namin kailangan ang folder ng mapagkukunan sa ngayon, hindi namin ito gagamitin. Pero hayaan mo siyang mahiga.

Nagiging isang web project

Oras na para i-convert natin ang ating Maven project sa isang web project. Upang gawin ito, mag-right-click sa pangalan ng proyekto sa punong ito at piliin ang Magdagdag ng suporta sa balangkas...
Paglikha ng isang simpleng proyekto sa web sa IntelliJ Idea Enterprise.  Hakbang-hakbang, na may mga larawan - 7
Magbubukas ang isang window kung saan maaari kaming magdagdag ng suporta para sa lahat ng uri ng iba't ibang mga frameworks para sa aming proyekto. Ngunit isa lang ang kailangan namin: Web Application . Pinipili natin siya.
Creation простейшего веб-проекта в IntelliJ Idea Enterprise. Пошагово, с картинками - 8
Sinusuri namin na may checkmark sa tabi ng Web Application , at sa pangunahing bahagi ng window ay nabanggit na gusto namin agad na gumawa ng web.xml file para sa amin (Inirerekumenda kong suriin ang kahon kung wala ito). Pagkatapos nito, makikita namin na ang istraktura ng aming proyekto ay nadagdagan ng web folder .
Creation простейшего веб-проекта в IntelliJ Idea Enterprise. Пошагово, с картинками - 9
Ito ang ugat ng aming proyekto sa web sa / . Iyon ay, kung ipinasok namin ang localhost address sa browser (kapag inilunsad namin ito, siyempre), pagkatapos ay mai-access ito nang eksakto dito, sa ugat ng proyekto sa web. Kung ilalagay namin ang localhost/addUser , ang web folder ay maghahanap ng mapagkukunan na tinatawag na addUser .
Ang pangunahing bagay ay upang maunawaan na ang web folder ay ang ugat ng aming proyekto kapag na-upload namin ito sa Tomcat. Ngayon mayroon kaming isang tiyak na istraktura ng folder, ngunit sa natapos na proyekto na aming ia-upload, ito ay bahagyang naiiba, at ang web folder ay magiging ugat doon.
Sa web mayroong kinakailangang folder na tinatawag na WEB-INF , kung saan matatagpuan ang web.xml file , na hiniling naming gawin sa nakaraang hakbang. buksan natin.
Creation простейшего веб-проекта в IntelliJ Idea Enterprise. Пошагово, с картинками - 10
Tulad ng nakikita mo, wala pang kawili-wili dito, tanging ang "sombrero". Sa pamamagitan ng paraan, kung hindi namin hiniling na likhain ito, maaaring kailanganin naming gawin ito nang manu-mano, iyon ay, i-type ang buong "header" sa pamamagitan ng kamay, o, sa matinding mga kaso, maghanap ng isang handa na bersyon sa Internet . Para saan ang web.xml ? Para sa pagmamapa. Dito ay sasabihin namin sa Tomcat kung aling URL ang humihiling na ipadala sa kung aling mga servlet. Ngunit mamaya na lang iyon, sa ngayon ay hahayaan muna natin itong walang laman. Mayroon ding file na tinatawag na index.jsp sa web folder . buksan natin.
Creation простейшего веб-проекта в IntelliJ Idea Enterprise. Пошагово, с картинками - 11
Ito ang file na isasagawa bilang default, wika nga. Ibig sabihin, kapag inilunsad natin ang proyekto, ito mismo ang makikita natin. Sa esensya, ang jsp ay isang regular na html file, na may pagkakaiba na maaari mong isagawa ang java code dito.

Medyo tungkol sa static at dynamic na content

Ang static na content ay content na hindi nagbabago sa paglipas ng panahon. Lahat ng isinulat namin sa html file ay ipapakita nang walang pagbabago. Kung isinulat namin ang hello world, ang inskripsyon na ito ay ipapakita sa sandaling buksan namin ang pahina, at sa loob ng 5 minuto, at bukas, at sa isang linggo, at sa isang taon. Hindi siya magbabago. Ngunit paano kung gusto naming ipakita ang kasalukuyang petsa sa pahina? Kung isusulat lang natin ang "Oktubre 27, 2017," bukas ay makikita natin ang parehong petsa, at sa isang linggo, at sa isang taon. Ngunit nais kong maging makabuluhan pa rin ang petsang ito. Dito nakakatulong sa amin ang kakayahang magsagawa ng ilang code nang direkta sa loob ng page. Makakakuha tayo ng date object, i-convert ito sa form na kailangan natin at ipakita ito sa page. At araw-araw, sa tuwing bubuksan natin ang pahina, ang petsa ay palaging may kaugnayan. Kung kailangan lang namin ng static na nilalaman, kung gayon ang isang regular na web server at mga html na file ay sapat na para sa amin. Hindi namin kailangan ng anumang Java, Maven, o Tomcat. Ngunit kung gusto nating gumamit ng dynamic na nilalaman, dito ang lahat ng ito ay magiging kapaki-pakinabang. Ngunit sa ngayon ay bumalik tayo sa aming index.jsp . Magpahiwatig tayo ng sarili nating bagay sa halip na ang karaniwang header, halimbawa, "Aking super web-app!", at sa katawan ay isusulat natin, halimbawa, "Buhay ako!" Halos handa na kaming ilunsad ang aming proyekto! Ngunit, sa kasamaang-palad, ang karaniwang berdeng tatsulok para sa paglulunsad ng programa ay hindi aktibo.
Creation простейшего веб-проекта в IntelliJ Idea Enterprise. Пошагово, с картинками - 12
Mag-click tayo sa pindutan sa kaliwa nito (ipinahiwatig sa screen na may pulang arrow) at piliin ang I-edit ang mga pagsasaayos... Magbubukas ang isang window kung saan hihilingin sa amin na mag-click sa berdeng plus sign upang magdagdag ng ilang uri ng pagsasaayos. Mag-click dito, ito ay matatagpuan sa itaas na kaliwang sulok ng window.
Creation простейшего веб-проекта в IntelliJ Idea Enterprise. Пошагово, с картинками - 13
Piliin ang item ng Tomcat Server at ang Local sub-item. Magbubukas ang isang window na may maraming iba't ibang mga parameter, ngunit masaya kami sa halos lahat ng bagay at ang default.
Creation простейшего веб-проекта в IntelliJ Idea Enterprise. Пошагово, с картинками - 14
Maaari naming kahit papaano ay maipapangalanan ang aming configuration sa halip na ang karaniwang Unnamed (sa pinakatuktok). Kinakailangan din na suriin kung ang ideya ay matagumpay na natagpuan ang Tomcat sa aming system ( na-download at na-install mo na ito bago , tama?). Kung hindi mo ito mahanap (na hindi malamang), i-click ang pababang arrow at piliin kung saan namin ito na-install, o ibang bersyon kung mayroon kang ilan sa mga ito. Mayroon akong isa at naka-install na ito, kaya ang lahat ay kamukha sa screenshot. At sa pinakailalim ng window ay makikita natin na mayroong babala na walang isang artifact na inilaan para sa pag-deploy sa server. At sa kanan ng inskripsiyong ito ay may isang pindutan na nag-aalok upang iwasto ang depektong ito. Nag-click kami dito at nakita na ang ideya mismo ay natagpuan ang lahat, nilikha ang lahat mismo, kung ano ang nawawala, at ginawa ang lahat ng mga setting mismo.
Creation простейшего веб-проекта в IntelliJ Idea Enterprise. Пошагово, с картинками - 15
Nakita namin na inilipat kami mula sa tab na Server patungo sa tab na Deployment , sa seksyong I-deploy sa startup ng server ay mayroon na kaming artifact na kailangang i-deploy, at sa ibaba ay ipinapahiwatig na ang artifact na ito ay gagawin bago ang pag-deploy. Mag-apply, Ok. At nakita namin na una, sa ibaba ng window ay lumitaw ang isang seksyon kasama ang aming lokal na server ng Tomcat, kung saan ilalagay ang aming artifact. Maaari mong i-collapse ang seksyong ito sa pamamagitan ng pag-click sa kaukulang button sa kanang bahagi ng window.
Creation простейшего веб-проекта в IntelliJ Idea Enterprise. Пошагово, с картинками - 16
Nakikita rin namin na ang berdeng tatsulok para sa paglulunsad ay aktibo na. Para sa mga gustong suriin ang lahat, maaari kang mag-click sa pindutan na may mga setting ng proyekto (sa kanan ng mga pindutan ng paglulunsad, na minarkahan ng pulang arrow), pumunta sa seksyon ng Artifacts at siguraduhin na ang artifact ay talagang nilikha. Wala iyon hanggang sa pinindot namin ang Fix button na iyon , ngunit ngayon ay ok na ang lahat. At ang pagsasaayos na ito ay angkop sa amin. Sa madaling sabi, ang pagkakaiba sa pagitan ng my-super-project:war at my-super-project:war ay sumabog na ang my-super-project:war ay lilikha lamang ng isang war file (na isang archive lamang), at ang opsyon na may ang sumabog ay isang “unpacked” na digmaan lamang . At ang pagpipiliang ito ay personal na mas maginhawa para sa akin, dahil pinapayagan akong mabilis na mag-deploy ng maliliit na pagbabago sa server. Sa katunayan, ang artifact ay ang aming proyekto, na naipon na, at kung saan ang istraktura ng folder ay binago upang mai-upload ito nang direkta sa Tomcat. Magiging ganito ang hitsura nito:
Creation простейшего веб-проекта в IntelliJ Idea Enterprise. Пошагово, с картинками - 17
Ngayon, handa na ang lahat para ilunsad ang aming proyekto. Pinindot namin ang hinahangad na berdeng start button at tamasahin ang resulta! :)
Creation простейшего веб-проекта в IntelliJ Idea Enterprise. Пошагово, с картинками - 18
Mga komento
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION