Maven، Spring، MySQL، Hibernate اور پہلی CRUD ایپلیکیشن کا تعارف (حصہ 4)

صبح بخیر اس مضمون میں میں اپنی پہلی ملاقات Maven، Spring، Hibernate، MySQL اور Tomcat جیسی چیزوں کے ساتھ شیئر کرنا چاہوں گا جو ایک سادہ CRUD ایپلیکیشن بنانے کے عمل میں ہے۔ یہ آخری حصہ ہے۔ مضمون کا مقصد بنیادی طور پر ان لوگوں کے لیے ہے جنہوں نے یہاں پہلے ہی 30-40 درجے مکمل کر لیے ہیں، لیکن ابھی تک خالص جاوا سے آگے نہیں نکلے ہیں اور ان تمام ٹیکنالوجیز، فریم ورکس اور دیگر غیر مانوس الفاظ کے ساتھ کھلی دنیا میں داخل ہونے کی شروعات (یا شروع ہونے والے ہیں) کر رہے ہیں۔ . یہ مضمون کا آخری چوتھا حصہ ہے "Introduction to Maven, Spring, MySQL, Hibernate and first CRUD ایپلیکیشن۔" پچھلے حصے لنکس پر عمل کر کے دیکھے جا سکتے ہیں:

• Maven، Spring، MySQL، Hibernate اور پہلی CRUD ایپلیکیشن کا تعارف (حصہ 1)
• Maven، Spring، MySQL، Hibernate اور پہلی CRUD ایپلیکیشن کا تعارف (حصہ 2)
• Maven، Spring، MySQL، Hibernate اور پہلی CRUD ایپلیکیشن کا تعارف (حصہ 3)

مواد:

• ڈیزائن اور ویب وسائل
• صفحہ بندی
• نتیجہ

ڈیزائن اور ویب وسائل

ہماری ایپلیکیشن کام کرتی ہے، لیکن آپ اسے آنسوؤں، بورنگ نوشتہ جات، بدصورت لنکس، خالی سفید پس منظر کے بغیر نہیں دیکھ سکتے۔ ہمیں اسے ٹھیک کرنے اور مختلف خوبصورتی شامل کرنے کی ضرورت ہے۔ ہم یہ کیسے کرتے ہیں؟ ٹھیک ہے، سب سے پہلے، آپ صرف صفحات کے ساتھ کھیل سکتے ہیں اور HTML کی صلاحیتوں کا استعمال کرتے ہوئے ہر طرح کی چیزیں کر سکتے ہیں ۔ لیکن اگر آپ صرف ایچ ٹی ایم ایل کا استعمال کرتے ہوئے پس منظر، رنگ، سائز، عناصر کی ترتیب وغیرہ کو تبدیل کرنے کی کوشش کرتے ہیں۔ اور اسی طرح. پھر آخر میں آپ صفحہ سے ایسی گڑبڑ کر سکتے ہیں کہ بعد میں آپ وہاں کچھ نہیں بنا سکتے۔ اور اس کے علاوہ، HTML کے ڈیزائن کے اختیارات کافی محدود ہیں۔ اس کے لیے CSS (Cascading Style Sheets) کا استعمال کرنا بہتر ہے۔ پھر ڈیزائن سے متعلق ہر چیز کو ایک جگہ جمع کیا جا سکتا ہے، اور پھر صفحہ کے مطلوبہ عنصر پر لاگو کیا جا سکتا ہے۔ CSS کوڈ کو براہ راست JSP صفحہ پر ایک خاص ٹیگ میں لکھا جا سکتا ہے ، لیکن اسے ایک علیحدہ فائل میں ڈالنا اور پھر اسے ضروری صفحات پر لاگو کرنا زیادہ آسان ہے۔ فائلوں کو اسٹائل اور دیگر جامد ویب وسائل کے ساتھ رکھنے کے لیے، ہم webapp کے اندر ایک علیحدہ ڈائریکٹری بنائیں گے ۔ ویب وسائل کو باقاعدہ وسائل (جہاں ہمارے پاس ہے db.properties ) کے ساتھ الجھانے کے لیے ، آئیے صرف اس ڈائریکٹری کو res کال کریں اور تمام CSS فائلیں، تصاویر وغیرہ کو وہاں رکھیں: ان فائلوں کو استعمال کرنے کے لیے ہمیں کنفیگریشن میں ان کا مقام بتانا ہوگا۔ چلو اپنی کلاس میں چلتے ہیں WebConfig۔ پہلے، ہم تشریح کا استعمال @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>

بس اس لائن کو شامل کریں اور بنائیں، مثال کے طور پر، یہ سادہ سی ایس ایس فائل:

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;
}

اور یہ ہماری میز کو مکمل طور پر تبدیل کر دے گا (یقیناً یہ احمقانہ لگتا ہے، لیکن یہ اس طرح ہے، مثال کے طور پر): ٹھیک ہے، میرے خیال میں CSS کے بارے میں تفصیل سے بات کرنے کی ضرورت نہیں ہے، سب کچھ بہت آسان ہے۔ انٹرنیٹ پر آپ میزوں اور فارموں کو ڈیزائن کرنے کے لیے بہت سے ریڈی میڈ آپشنز تلاش کر سکتے ہیں۔ لیکن یہ بہتر ہے، یقیناً، خود ڈیزائن کرنے کے لیے، آپ کو ڈیزائنر بننے کی ضرورت نہیں ہے، آخر یہ کسی قسم کی پیچیدہ سائٹ نہیں ہے۔ پہلے شناسائی کے چند گھنٹے بعد بھی اتنے سادہ صفحے کے لیے کافی خوبصورت اور صاف ستھرا ڈیزائن بنانے کے لیے کافی ہوں گے۔ اس کے علاوہ، انٹرنیٹ ہر طرح کے اسباق، مثالوں سے بھرا ہوا ہے، ایسی خاص سائٹیں ہیں جہاں آپ بیک وقت ایک اسکرین پر ایچ ٹی ایم ایل، سی ایس ایس کو ایڈٹ کر سکتے ہیں اور فوراً دیکھ سکتے ہیں کہ یہ سب کیسا لگتا ہے۔ تھوڑی سی مشق سے آپ حقیقی فن تخلیق کر سکتے ہیں۔ یہ سچ ہے کہ آپ کو یہاں بھی زیادہ دور نہیں ہونا چاہئے (جب تک کہ آپ کا ڈیزائنر بننے کا ارادہ نہ ہو)، ورنہ ڈیزائن ایسی چیز ہے، آپ یہاں بہت لمبے عرصے تک پھنس سکتے ہیں۔ جب میں نے پہلی بار CSS کو سمجھنا شروع کیا تو میں پھنس گیا۔ میں ہر چیز کو آزمانا چاہتا تھا، ہر پراپرٹی، کچھ موڑنا، اس کے ساتھ ٹنکر کرنا، تجربہ کرنا، کچھ سائٹس کے صفحات لینا اور انہیں شناخت سے باہر دوبارہ بنانا۔ میں نے شاید ایک ہفتے تک اس کھلونے کے ساتھ مزہ کیا، اور کچھ نہیں کیا، جب تک کہ اس نے مجھے جانے نہ دیا :) ٹھیک ہے، عام طور پر، یقیناً، آپ کو اس سے زیادہ نہیں کرنا چاہیے اور ایک ناقابل فہم رنگین معجزہ نہیں بنانا چاہیے، آپ کو اسے آسانی سے کرنے کی ضرورت ہے۔ ذائقہ سے صرف ایک بات قابل توجہ ہے۔ آپ کو یہ سمجھنے کی ضرورت ہے کہ CSS ڈیزائن کی تفصیل ہے ، اور HTML مارک اپ ہے ۔ آپ کو سی ایس ایس کے ذریعے ہر کام کرنے کی کوشش نہیں کرنی چاہیے؛ کچھ پہلوؤں کو کرنا بہت مشکل ہوگا، اور کچھ ناممکن ہیں، جب ایچ ٹی ایم ایل میں یہ کچھ اضافی لائنوں کے ساتھ کیا جاتا ہے، یا یہاں تک کہ ٹیگ میں صرف ایک خاصیت کے ساتھ۔ آپ کو ان کو یکجا کرنے، سی ایس ایس میں ہر طرح کے رنگ، پس منظر، فونٹ بنانے کی ضرورت ہے، اور اگر، مثال کے طور پر، آپ کو کچھ ٹیبل سیلز کو یکجا کرنے کی ضرورت ہے، تو HTML ٹولز استعمال کرنا آسان ہے۔ ٹھیک ہے، مثال کے طور پر، میں سی ایس ایس اور ایچ ٹی ایم ایل کے ساتھ چند گھنٹوں میں صفحات کے ساتھ کیا کرنے میں کامیاب ہو گیا تھا (میں یہاں اس گڑبڑ کے بارے میں تفصیل میں نہیں جاؤں گا جو میں نے اس کو حاصل کرنے کے لیے کیا تھا، آخر میں وہاں ہو گا۔ اس پروجیکٹ کے گٹ ہب کا ایک لنک جہاں آپ دیکھ سکتے ہیں): یقینا، میں نہیں جانتا کہ میں نے وہاں سب کچھ کیا ہے، لیکن اس بات پر غور کرتے ہوئے کہ میں نے ایک ہفتہ پہلے سی ایس ایس کو پہلی بار دیکھا تھا، میرے خیال میں یہ کافی اچھا نکلا۔

صفحہ بندی

اب سب کچھ کام کرتا ہے، یہ اچھا لگ رہا ہے، لیکن ابھی تک ٹیبل میں صرف چند ریکارڈ موجود ہیں. کیا ہوگا اگر اس میں سو فلمیں ہوں، یا ایک ہزار؟ اتنی لمبی فہرست کو اسکرول کرنا زیادہ آسان نہیں ہے۔ مثال کے طور پر جب فہرست 10 اندراجات کے صفحات میں ظاہر ہوتی ہے تو یہ بہت زیادہ آسان ہوتا ہے۔ لہذا، اب ہم فہرست کو صفحات میں تقسیم کرنے کی کوشش کریں گے (بعض اوقات اسے "پیجنگ" یا "صفحہ بندی" ( انگریزی صفحہ بندی ) بھی کہا جاتا ہے۔ یہ مختلف طریقوں سے کیا جا سکتا ہے۔ مثال کے طور پر، آپ پوری فہرست کو jsp صفحہ پر منتقل کر سکتے ہیں اور مطلوبہ تعداد کے ریکارڈ کے لیے وہاں ایک ٹیبل بنا سکتے ہیں۔ یا، مثال کے طور پر، آپ سروس میں موجود عمومی فہرست سے مطلوبہ ریکارڈ نکال سکتے ہیں، اور پھر اس منی لسٹ کو ڈسپلے کے لیے jsp صفحہ پر بھیج سکتے ہیں۔ لیکن یہ سب سے بہتر ہے، یقیناً، ڈیٹا بیس کی سطح پر ایسا کرنا۔ خیال یہ نہیں ہے کہ ڈیٹا بیس سے مکمل فہرست لے کر پھر اسے ٹکڑوں میں توڑ دیا جائے بلکہ ابتدائی طور پر ہر چیز کو چھوئے بغیر ڈیٹا بیس سے مطلوبہ ٹکڑا حاصل کرنا ہے۔ آخر ہمیں ڈیٹا بیس سے تمام سیکڑوں یا ہزاروں ریکارڈز کو ایک ساتھ نکالنے کی کیا ضرورت ہے، اگر ہمیں جس کی ضرورت ہے وہ ٹاپ ٹین میں ہے، تو بہتر ہے کہ صرف اس دس کو ہی نکال لیں۔ آئیے DAO پر جائیں اور طریقہ میں allFilmsایک پیرامیٹر شامل کریں int page، جو صفحہ نمبر کے لیے ذمہ دار ہو گا (خدمت میں، یقیناً ہم بھی ایسا ہی کرتے ہیں)۔ اور آئیے اس طریقہ کار کے نفاذ کو تھوڑا سا تبدیل کرتے ہیں؛ اگر پہلے ہم نے پوری فہرست نکال لی تھی، اب ہم صرف ایک حصہ نکالیں گے۔ setFirstResultطریقے (ٹیبل کی کون سی قطار سے شروع کرنا ہے) اور 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();
}

وہ. اگر یہ پہلا صفحہ ہے، تو ہم 0 سے شروع ہونے والے زیادہ سے زیادہ 10 ریکارڈ دکھاتے ہیں؛ اگر یہ 5 واں صفحہ ہے، تو 40ویں سے شروع ہونے والے 10 ریکارڈز (یہ نہ بھولیں کہ ڈیٹا بیس میں نمبرنگ 0 سے شروع ہوتی ہے)۔ ہم اضافی طور پر ایک طریقہ بھی بنائیں گے جو ٹیبل میں ریکارڈ کی تعداد کو واپس کرے گا۔ ہمیں تمام صفحات کی تعداد جاننے اور اپنے jsp صفحہ پر ان کے لیے لنکس بنانے کے لیے اس کی ضرورت ہوگی۔

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

اس طرح کے استفسار کا استعمال کرتے ہوئے، ہم ٹیبل میں تمام ریکارڈز کی تعداد حاصل کریں گے ( 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;
}

یہاں ایک نئی تشریح نمودار ہوئی ہے @RequestParam، جو اس بات کی نشاندہی کرتی ہے کہ ہم درخواست کے پیرامیٹر سے یہ قدر حاصل کر رہے ہیں۔ اب، اگر ہم پیرامیٹر کے ساتھ ایڈریس پر جائیں، مثال کے طور پر http://localhost:8080/ ?page=4 ، ہمیں اس کے مطابق چوتھا صفحہ ملے گا۔ ہم نے ڈیفالٹ ویلیو کو " 1 " پر سیٹ کیا ہے تاکہ جب ایپلیکیشن شروع ہوتی ہے، جب ہم http://localhost:8080/ پیرامیٹر کے بغیر کسی ایڈریس پر جاتے ہیں تو ہمیں پہلا صفحہ ملتا ہے۔ جس طریقے سے ہم تمام ریکارڈز کی تعداد حاصل کرتے ہیں، اس آسان طریقے سے ہم صفحات کی تعداد کا حساب لگاتے ہیں۔ وہ. اگر ہمارے پاس 10 ریکارڈ ہیں، تو یہ 1 صفحہ ہے، اور اگر 11 ہیں، تو یہ پہلے سے ہی 2 ہے۔ ٹھیک ہے، ہم اس ساری چیز کو ماڈل میں منتقل کر دیتے ہیں۔ ایک چکر میں ان سب کے لنکس بنانے کے لیے آپ کو صفحات کی تعداد جاننے کی ضرورت ہے، اور فلموں کی تعداد صرف اس صورت میں ہونے دیں، مثال کے طور پر، اگر آپ اس معلومات کو صفحہ پر کہیں ظاہر کرنا چاہتے ہیں۔ اب بس فلم ڈاٹ جے ایس پی پر جانا اور اس تعمیر کا استعمال کرتے ہوئے ہر صفحے پر لنکس شامل کرنا باقی ہے۔

<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، ... کے ذریعہ لنکس بناتے ہیں اور پیرامیٹر کو انڈیکس ویلیو سے سیٹ کرتے ہیں۔ آئیے ایک اور چھوٹا ٹچ شامل کریں۔ ہم کنٹرولر پر واپس آتے ہیں۔ شامل کرنے، ترمیم کرنے اور حذف کرنے کے طریقوں میں، آپریشن مکمل ہونے کے بعد، ہم مرکزی صفحہ "ری ڈائریکٹ:/" پر بھیج دیتے ہیں ۔ وہ. اگر ہم 50ویں صفحہ پر کہیں ہیں اور ایڈٹ انٹری پر کلک کرتے ہیں، تو عمل کے بعد ہم ایڈریس " / " پر جائیں گے، یعنی آئیے صفحہ 1 پر واپس چلتے ہیں۔ یہ بہت آسان نہیں ہے؛ میں وہاں واپس جانا چاہوں گا جہاں سے ہم آئے تھے۔ آئیے اسے بہت آسان حل کرتے ہیں۔ آئیے کلاس میں FilmControllerایک مثال متغیر بنائیںint page

private int page;

طریقہ کار کے اندر allFilmsہم اس متغیر کو پیرامیٹر کی قدر تفویض کریں گے page:

this.page = page;

وہ. جب بھی اس طریقہ پر عمل کیا جائے گا (یعنی جب ہم صفحات پر جائیں گے) تو موجودہ صفحہ کی قدر متغیر پر لکھی جائے گی۔ اور پھر ہم اس قدر کو اپنے طریقوں میں اسی صفحہ پر واپس بھیجنے کے لیے استعمال کرتے ہیں۔

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

نتیجہ

ہم شاید یہیں ختم کریں گے۔ نتیجہ ایک مکمل CRUD درخواست ہے۔ یہ یقینی طور پر مثالی (بہت دور) سے دور ہے، لیکن اسے بہتر اور بہتر بنایا جا سکتا ہے، کیڑے ٹھیک کیے جا سکتے ہیں اور فعالیت شامل کی جا سکتی ہے۔ آپ کروڈ آپریشنز کے لیے بلٹ ان طریقے استعمال کر سکتے ہیں۔ فلٹرنگ، تلاش، چھانٹنا شامل کریں؛ دیگر متعلقہ میزیں شامل کریں؛ اجازت اور توثیق وغیرہ کے ساتھ مختلف صارفین کے لیے سپورٹ نافذ کریں۔ اور اسی طرح. تخیل کی گنجائش لامحدود ہے، لہذا اس کے لیے جائیں۔ اس پروجیکٹ کے گیتھب سے لنک کریں ۔ آپکی توجہ کا شکریہ. 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)