Maven, Spring, MySQL, Hibernate жана биринчи CRUD тиркемелерине киришүү (4-бөлүк)

Кутмандуу күнүң менен. Бул макалада мен жөнөкөй CRUD тиркемесин түзүү процессинде Maven, Spring, Hibernate, MySQL жана Tomcat сыяктуу нерселер менен болгон биринчи жолугушуум менен бөлүшкүм келет. Бул акыркы бөлүгү. Макала биринчи кезекте бул жерде 30-40 деңгээлди бүтүргөн, бирок таза Java чегинен чыга элек жана ушул технологиялар, фреймворктар жана башка бейтааныш сөздөр менен ачык дүйнөгө кире баштагандарга (же башталмакчы) арналган. . Бул "Maven, Spring, MySQL, Hibernate жана биринчи CRUD тиркемесине киришүү" макаласынын акыркы төртүнчү бөлүгү. Мурунку бөлүктөрдү төмөнкү шилтемелер аркылуу көрүүгө болот:

• Maven, Spring, MySQL, Hibernate жана биринчи CRUD тиркемесине киришүү (1-бөлүк)
• Maven, Spring, MySQL, Hibernate жана биринчи CRUD тиркемесине киришүү (2-бөлүк)
• Maven, Spring, MySQL, Hibernate жана биринчи CRUD тиркемесине киришүү (3-бөлүк)

Мазмуну:

• Дизайн жана веб-ресурстар
• Барактоо
• Корутунду

Дизайн жана веб-ресурстар

Биздин колдонмо иштейт, бирок сиз аны көз жашсыз, кызыксыз жазууларсыз, жаман шилтемелерсиз, бош ак фонсуз карай албайсыз. Муну оңдоп, ар кандай кооздуктарды кошуубуз керек. Муну кантип кылабыз? Биринчиден, сиз жөн гана барактар ​​менен ойноп, HTML мүмкүнчүлүктөрүн колдонуу менен ар кандай иштерди жасай аласыз . Бирок эгер сиз HTMLди гана колдонуу менен фонду, түстөрдү, өлчөмдөрдү, элементтердин жайгашуусун ж.б. өзгөртүүгө аракет кылсаңыз. жана башка. анан акырында сиз барактан ушундай баш аламандык жасай аласыз, кийинчерээк ал жерден эч нерсе чыгара албайсыз. Мындан тышкары, HTMLдин дизайн варианттары абдан чектелген. Бул үчүн CSS (Cascading Style Sheets) колдонуу жакшы. Андан кийин дизайнга тиешелүү нерселердин бардыгын бир жерге чогултса болот, андан кийин барактын керектүү элементине колдонулат. CSS codeун түздөн-түз JSP бетине атайын тегде жазса болот , бирок аны өзүнчө файлга салып, андан кийин жөн гана керектүү беттерге колдонуу алда канча ыңгайлуу. Стилдери жана башка статикалык веб-ресурстары бар файлдарды жайгаштыруу үчүн webapp ичинде өзүнчө каталог түзөбүз . Веб-ресурстарды кадимки ресурстар менен чаташтырбоо үчүн (бизде db.properties бар ), келгиле, бул каталогду res деп атайлы жана бардык CSS файлдарын, сүрөттөрүн ж.б. ошол жерге жайгаштыралы: Бул файлдарды колдонуу үчүн конфигурацияда алардын жайгашкан жерин көрсөтүшүбүз керек. Биздин класска баралы WebConfig. Мурда биз annotationны @EnableWebMvcэч нерсени конфигурациялоо үчүн эмес, жөн гана демейки конфигурацияны колдонуу үчүн колдончубуз. Бирок азыр бир нерсени конфигурациялоо зарылчылыгы бар. WebMvcConfigurerБул үчүн, биз конфигурация ыкмаларын жокко чыгарууга мүмкүндүк берген интерфейсти колдонобуз . Ошол. биз демейки конфигурацияны колдоно алабыз, бирок ошол эле учурда кээ бир аспектилерди өзүбүзгө ылайыкташтыра алабыз. Бул учурда addResourceHandlers, бизге статикалык веб-ресурстардын жайгашкан жерин көрсөтүүчү ыкма керек. Болбосо, бүткүл класс мындай көрүнүштө аяктайт:

package testgroup.filmography.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.ComponentScan;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.ViewResolver;
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
import org.springframework.web.servlet.view.InternalResourceViewResolver;

@Configuration
@EnableWebMvc
@ComponentScan(basePackages = "testgroup.filmography")
public class WebConfig implements WebMvcConfigurer {

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/res/**").addResourceLocations("/res/");
    }

    @Bean
    ViewResolver viewResolver() {
        InternalResourceViewResolver viewResolver = new InternalResourceViewResolver();
        viewResolver.setPrefix("/WEB-INF/pages/");
        viewResolver.setSuffix(".jsp");
        return viewResolver;
    }
}

Эми биздин CSS баракчабызды колдонуу үчүн тегдин ичинде ага шилтеме кылышыңыз керек head:

<head>
    <link href="<c:url value="/res/style.css"/>" rel="stylesheet" type="text/css"/>
</head>

Жөн гана бул сапты кошуп, мисалы, бул жөнөкөй CSS файлын жасаңыз:

table {
    border-spacing: 0 10px;
    font:  bold 100% Georgia, serif;
    margin: 40px auto;
    text-shadow: 5px 5px 5px #3F3F7F;
    background: #B1B9D9;
    text-align: center;
    vertical-align: middle;
    width: 50%;
    border: 10px solid blue;
}

Жана бул биздин tableбызды толугу менен өзгөртөт (албетте, бул акылсыз көрүнөт, бирок, мисалы, мындай): Ооба, CSS жөнүндө майда-чүйдөсүнө чейин сөз кылуунун кажети жок деп ойлойм, баары жөнөкөй. Интернетте tableларды жана формаларды долбоорлоо үчүн көптөгөн даяр варианттарды таба аласыз. Бирок, албетте, дизайнды өзүңүз жасаганыңыз жакшы, дизайнер болуунун кереги жок, анткени бул кандайдыр бир татаал сайт эмес. Биринчи таанышуудан бир нече саат өткөндөн кийин да, мындай жөнөкөй барактын бир кыйла кооз жана тыкан дизайнын түзүү үчүн жетиштүү болот. Кошумчалай кетсек, Интернет ар кандай сабактарга, мисалдарга толгон, бир эле учурда HTML, CSSти бир экранда оңдоп, анын баары кандай экенин дароо көрө ала турган атайын сайттар бар. Бир аз машыгуу менен чыныгы искусствону жарата аласыз. Туура, бул жерде да өтө эле алаксып кетпеш керек (эгер, албетте, дизайнер болуу пландарың жок болсо), антпесе дизайн бул нерсе, бул жерде көпкө тыгылып калышың мүмкүн. Мен CSSти биринчи жолу түшүнө баштаганда тыгылып калдым. Мен бардыгын, ар бир касиетти сынап көргүм келди, бир нерсени буруп, аны менен аралаштырып, эксперимент жасап, кээ бир сайттардын барактарын алып, аларды таанылгыс кылып кайра жасагым келди. Мен бул оюнчук менен бир жума бою көңүл ачкандырмын, башка эч нерсе кылбай, ал мени коё бергиче :) Ооба, жалпысынан, албетте, аны аша чаап, түшүнүксүз түстүү керемет жасабаш керек, муну жөнөкөй жана жөнөкөй кылыш керек. даамдуу. Белгилей кетчү нерсе. Сиз CSS бул дизайндын сүрөттөлүшү , ал эми HTML - белгилөө экенин түшүнүшүңүз керек . Сиз CSS аркылуу бардыгын жасоого аракет кылбаңыз; кээ бир аспектилерди аткаруу өтө кыйын, ал эми кээ бирлери жөн эле мүмкүн эмес, HTMLде бул бир нече кошумча саптар же тегдеги бир эле атрибут менен жасалса. Сиз аларды бириктирип, CSSте ар кандай түстөрдү, фондорду, шрифттерди жасашыңыз керек жана, мисалы, бир нече table клеткаларын бириктиришиңиз керек болсо, HTML куралдарын колдонуу оңой. Мисалы, мен CSS жана HTML менен бир нече сааттын ичинде барактарды жасай алдым (мен бул жерде мен буга жетүү үчүн жасаган башаламандыктар жөнүндө майда-чүйдөсүнө чейин айтып бербейм, акырында бул долбоордун GitHub шилтемеси, анда сиз карап көрө аласыз): Албетте, мен ал жерде бардыгын канчалык сабаттуу кылганымды билбейм, бирок CSSти бир жума мурун биринчи жолу көргөнүмдү эске алсам, бул абдан жакшы болду деп ойлойм.

Барактоо

Азыр баары иштейт, жакшы көрүнөт, бирок tableда азырынча саналуу гана жазуулар бар. Анда жүз же миң фильм болсочу?Мынчалык узун тизмени жылдыруу анчалык деле ыңгайлуу эмес. Тизме, мисалы, 10 жазуудан турган барактарда көрсөтүлгөндө, бул алда канча ыңгайлуу. Ошондуктан, азыр биз тизмени барактарга бөлүүнү ишке ашырууга аракет кылабыз (кээде бул "пэйжинг" же "беттөө" ( англисче пагинация ) деп да аталат). Бул ар кандай жолдор менен жасалышы мүмкүн. Мисалы, сиз толук тизмени jsp барагына өткөрүп, керектүү сандагы жазуулар үчүн tableны түзө аласыз. Же, мисалы, сиз кызматтын жалпы тизмесинен керектүү жазууларды чыгарып, андан кийин бул мини-тизмени көрсөтүү үчүн jsp барагына жөнөтө аласыз. Бирок эң жакшысы, албетте, муну маалымат базасынын деңгээлинде кылуу. Идея маалымат базасынан толук тизмени алып, анан аны бөлүктөргө бөлүү эмес, адегенде башка бардык нерсеге тийбей базадан керектүү бөлүгүн алуу. Кантсе да, эмне үчүн бир эле учурда базадан жүздөгөн, миңдеген жазууларды сууруп чыгышыбыз керек, эгер бизге керектүүсү алдыңкы ондукка кирсе, ушул онду гана сууруп алганыбыз оң. Келгиле, DAOallFilms барып, методго параметрди кошолу int page, ал беттин номери үчүн жооптуу болот (кызматта, албетте, биз да ошондой кылабыз). Келгиле, бул ыкманы ишке ашырууну бир аз өзгөртөлү, эгерде мурда биз тизмени толугу менен чыгарсак, азыр бир бөлүгүн гана чыгарабыз. setFirstResultМетоддор (tableнын кайсы сабынан баштоо керек) жана setMaxResults(канча жазууну көрсөтүү керек) буга жардам берет :

@SuppressWarnings("unchecked")
public List<Film> allFilms(int page) {
    Session session = sessionFactory.getCurrentSession();
    return session.createQuery("from Film").setFirstResult(10 * (page - 1)).setMaxResults(10).list();
}

Ошол. эгерде бул 1-бет болсо, биз 0-беттен баштап эң көп дегенде 10 жазууну көрсөтөбүз, эгерде бул 5-бет болсо, анда 40-беттен баштап 10 жазуу (базадагы номерлөө 0дөн башталаарын унутпаңыз). Биз кошумча түрдө tableдагы жазуулардын санын кайтара турган ыкманы түзөбүз. Бул баардык баракчалардын санын билүү жана биздин jsp баракчабызда алар үчүн шилтемелерди түзүү үчүн керек болот:

public int filmsCount() {
     Session session = sessionFactory.getCurrentSession();
     return session.createQuery("select count(*) from Film", Number.class).getSingleResult().intValue();
 }

Мындай суроону колдонуп, биз tableдагы бардык жазуулардын санын ( intмаани катары) жазуулардын өздөрүн чыгарбастан алабыз. Эми контроллерге барып, тасмалардын тизмеси менен негизги баракты кайтарган ыкманын үстүндө иштейли:

@RequestMapping(value = "/", method = RequestMethod.GET)
public ModelAndView allFilms(@RequestParam(defaultValue = "1") int page) {
    List&ltFilm> films = filmService.allFilms(page);
    int filmsCount = filmService.filmsCount();
    int pagesCount = (filmsCount + 9)/10;
    ModelAndView modelAndView = new ModelAndView();
    modelAndView.setViewName("films");
    modelAndView.addObject("page", page);
    modelAndView.addObject("filmsList", films);
    modelAndView.addObject("filmsCount", filmsCount);
    modelAndView.addObject("pagesCount", pagesCount);
    return modelAndView;
}

Бул жерде жаңы annotation пайда болду @RequestParam, бул биз бул маанини сурам параметринен алып жатканыбызды көрсөтүп турат. Эми, эгерде биз параметр менен дарекке барсак, мисалы, http://localhost:8080/ ?page=4 , биз тиешелүү түрдө 4-бетти алабыз. Демейки маанини " 1 " кылып койдук, андыктан колдонмо башталганда, http://localhost:8080/ параметри жок дарекке барганда , биз биринчи баракты алабыз. Методдо биз бардык жазуулардын санын алабыз, андан кийин ушул жөнөкөй жол менен биз барактардын санын эсептейбиз. Ошол. эгерде бизде 10 жазуу бар болсо, бул 1 барак, ал эми 11 болсо, анда бул 2. Ооба, биз мунун баарын моделге өткөрүп беребиз. Алардын бардыгына циклде шилтемелерди түзүү үчүн сиз барактардын санын бorшиңиз керек жана тасмалардын саны ошол жерде болушу керек, мисалы, эгер сиз бул маалыматты барактын бир жеринде көрсөткүңүз келсе. Эми калганы films.jsp сайтына өтүп , бул конструкцияны колдонуп ар бир баракка шилтемелерди кошуу:

<c:forEach begin="1" end="${pagesCount}" step="1" varStatus="i">
    <c:url value="/" var="url">
        <c:param name="page" value="${i.index}"/>
    </c:url>
    <a href="${url}">${i.index}</a>
</c:forEach>

Биз 1, 2, 3, ... эсептегичтер боюнча шилтемелерди түзөбүз жана параметрди индекстин мааниси боюнча орнотобуз. Дагы бир кичинекей тийүү кошолу. Биз контроллерге кайтып келебиз. Кошуу, түзөтүү жана жок кылуу ыкмаларында операция аяктагандан кийин, биз "redirect:/" негизги бетине багыттайбыз . Ошол. эгерде биз 50-бетте бир жерде болсок жана жазууну түзөтүүнү чыкылдатсак, анда аткарылгандан кийин биз " / " дарегине барабыз , б.а. 1-бетке кайтып баралы. Бул абдан ыңгайлуу эмес, мен келген жерибизге кайткым келет. Муну абдан жөнөкөй чечели. Класста FilmControllerинстанция өзгөрмөсүн түзөлүint page

private int page;

Методдун ичинде allFilmsбиз бул өзгөрмөгө параметрдин маанисин ыйгарабыз page:

this.page = page;

Ошол. Бул ыкма аткарылган сайын (б.а. биз барактарды кыдырганда) учурдагы барактын мааниси өзгөрмөгө жазылат. Анан ошол эле баракка кайра багыттоо үчүн бул маанини методдорубузда колдонобуз.

modelAndView.setViewName("redirect:/?page=" + this.page);

Корутунду

Биз, балким, ушул жерден бүтүрөбүз. Натыйжада толук кандуу CRUD тиркеме болуп саналат. Бул, албетте, идеалдан алыс (абдан алыс), бирок аны оптималдаштырып, өркүндөтсө болот, мүчүлүштүктөр оңдолуп, функциялар кошулат. Сиз чийки операциялар үчүн камтылган ыкмаларды колдоно аласыз; чыпкалоо, издөө, сорттоо кошуу; башка тиешелүү tableларды кошуу; авторизация жана аутентификация менен ар кандай колдонуучулар үчүн колдоону ишке ашыруу, ж.б. жана башка. Элестетүүнүн мейкиндиги чексиз, андыктан ага барыңыз. Бул долбоордун github шилтемеси . Конул бурганын учун рахмат. PS Бул менин жашоомдо биринчи жолу макала жазуу аракетим, ошондуктан катуу соттобоңуз :). Пайдалуу ресурстарга ар кандай шилтемелерди кошпогонум үчүн кечирим сурайм; тилекке каршы, мен дагы эле маалымат алган булактарга шилтемелерди сактоо адатын өрчүтө албайм. Анан, албетте, көп тамгалар үчүн кечирим сурайм, кыскалык менин талантым эмес, кимдир бирөө аны көтөрө алат деп ишенем. Бардык бөлүктөргө шилтемелер

• Maven, Spring, MySQL, Hibernate жана биринчи CRUD тиркемесине киришүү (1-бөлүк)
• Maven, Spring, MySQL, Hibernate жана биринчи CRUD тиркемесине киришүү (2-бөлүк)
• Maven, Spring, MySQL, Hibernate жана биринчи CRUD тиркемесине киришүү (3-бөлүк)
• Maven, Spring, MySQL, Hibernate жана биринчи CRUD тиркемелерине киришүү (4-бөлүк)