Website Develop කිරීමේ ක්‍රියාවලිය

September 10, 2021 | Piumika Gunarathne

මූලික Website Develop කිරීමේ ක්‍රියාවලිය යනු කුමක්ද?

Website Development යන්නෙන් අදහස් කරන්නේ single plain-text වෙබ් පිටුවක් තැනීමේ සිට සංකීර්ණ Web Application හෝ සමාජ ජාලයක් දියුණු කිරීම දක්වා වූ ක්‍රියාවලියකටය. Website Develop කිරීමේ දී සාමාන්‍යයෙන් Web Markup සහ coding ගැන සඳහන් වන අතර ඊට අමතරව Client-side scripting, Server-side scripting, Server and Network Security Configuration, e-commerce Development, Content Management System (CMS) Development.වැනි development tasks ද ඇතුළත් වේ.

Website Develop කිරීමේ ක්‍රියාවලිය මෙතරම් වැදගත් වන්නේ ඇයි?

ඔබ ඔබේ ව්‍යාපාරයේ වෙබ් අඩවිය තැනීම සඳහා freelancer කෙනෙකු සොයන හිමිකරුවෙකු විය හැකිය, ඉගෙන ගන්නා ශිෂ්‍යයෙක් විය හැකිය. ඔබ කවුරුන් වුවත් මෙම Website Development පිළිබඳ කරුණු අවබෝධ කර ගැනීම මෙම තාක්‍ෂණය මත පදනම් වූ ලෝකයට හැඩගැසීමට උපකාරී වේ.

Website එකක් යනු කුමක්ද?

සරලවම වෙබ් අඩවි යනු servers මත ගබඩා කර ඇති files වන අතර ඒවා servers හා සම්බන්ධ වී අන්තර්ජාලය හරහා ලෝක පුරා ව්‍යාප්ත වේ.

Website Develop කිරීමේ ක්‍රියාවලිය

1) plan එකක් සාදාගැනීම

ඔබ කඩදාසිය මත පෑන තැබීමට හෝ යතුරු පුවරුවට අත් තැබීමට පෙර මුලින්ම ඔබේ කණ්ඩායම සමඟ සම්බන්ධ වී ඔබේ වෙබ් අඩවිය සඳහා සැලැස්මක් සකස් කිරීම අත්‍යවශ්‍යය. ඔබේ website draft සදහා සලකා බැලිය යුතු ප්‍රශ්න කිහිපයක් පහතින් දක්වා ඇත.

What is the goal of your website?

Who is your audience, and do you want them to do on your website?

What’s the type of website?

What content are you aiming to publish, and at what volume? What’s the purpose of this content?

Considering the big picture, how will you structure your website for the best navigational experience?

What’s your budget?

2) Wireframe එකක් නිර්මාණය කිරීම

සියලුම හොඳ Websites blueprint වලින් ආරම්භ වේ. මෙය wireframe හෝ site map ලෙස හඳුන්වයි. එය ඔබේ වෙබ් අඩවිය සඳහා වූ දැක්මක් පමණක් වන අතර එමඟින් ඔබට සහ අනෙක් developers ලාට ආරම්භයක් ලබා දේ. ඒ සදහා Invision, Slickplan, Mindnode වැනි tools භාවිතා කළ හැකිය,

ඔබේ වෙබ් අඩවිය සැලසුම් කිරීමේදී ඔබගෙන්ම මෙම ප්‍රශ්න ඇසීමට වගබලාගන්න.

What individual pages do you want? What content will be on those pages?

How can you organize those pages into categories?

What is the hierarchy of pages on your site?

How will the pages link together?

What pages and categories are essential to your site and user experience, and which ones could be removed or combined?

නැවතත්, ඔබේ organization තුළ අනෙකුත් කණ්ඩායම් සමඟ සාකච්ඡා කිරීමෙන් මෙය තවත් පහසු වේ. SEO හෝ Content Strategy Teams සිටී නම්, ඔබේ linking structure හා page categorizing කිරීමේදී ඔවුන්ගේ inputs වඩා වැදගත් වනු ඇත.

3) Website code ලිවීම.

වෙබ් අඩවි වල front-end සහ back-end මෙන්ම වෙබ් අඩවියේ විවිධ functionalities සඳහා (design, interactivity) developers විසින් විවිධ code languages භාවිතා කරනු ඇත. බහුලව භාවිතා වන languages HTML, CSS, JavaScript ය. සෑම වෙබ් අඩවියක්ම පාහේ මෙම තුනම එකට භාවිතා කරනු ඇත.

HTML

HyperText Markup Language (HTML) 1990 සිට භාවිතා කර ඇත. එය සියලුම වෙබ් අඩවි වල අඩිතාලම වන අතර වෙබ් අඩවියක් නිර්මාණය කිරීමට අවශ්‍ය අවම දේ මෙයයි. HTML පමණක් සහිත වෙබ් අඩවියක් සෑදිය හැකි වුණත්, එය එතරම් ප්‍රියමනාප ලෙස පෙනෙන්නේ නැත.

පහත දක්වා ඇත්තේ Bootstrap button එකක් සදහා HTML Code එකකි.

CSS සහ JavaScript වැනි භාෂා HTML code මඟින් ගොඩනඟන ලද මූලික website ව්‍යුහය වැඩි දියුණු කරයි.

HTML5 යනු මෑතක පැමිණි version වන අතර එය cross-platform browser functionalityට සහය දක්වන අතර mobile application development හිදී ජනප්‍රිය වී ඇත.

CSS

Cascading Style Sheets (CSS) 1990 දශකයේ අග භාගයේදී develop වූවකි. එය වෙබ් අඩවි වලට typography, colors, and layouts වැනි අංග එක් කරයි. එය Cosmetic code ලෙස ද හැදින්වේ.

Jumbotron අංගය customize කිරීම සඳහා යොදාගන්නා code පහත දක්වා ඇත.

JavaScript

JavaScript යනු coding language cherry-on-top language වේ. 90 දශකයේ මැද භාගයේ නිර්මාණය කරන ලද අතර, එය වෙබ් අඩවි වලට functionality බව එක් කිරීමට භාවිතා කරයි. Developers විසින් එය භාවිතා කරන්නේ ඇතැම් පිටු තුළ automate tasks, animations එකතු කිරීමට සහ user experience වැඩි කරන interactive features එකතු කිරීමට ය.

JavaScript අද වන විට ලොව බහුලව භාවිතා වන coding language එකකි. Node.Js හි ආධාරයෙන් එය දැන් back-end coding සදහාද යොදාගනී. Browser මඟින් තේරුම් ගත යුතු පළමු language එක එය වන අතර සමහරෙක් එයට Machine Learning යෙදීම ගැන පවා සාකච්ඡා කර ඇත.

WordPress හි new window එකක automatically opening links සඳහා වූ JavaScript code සටහනක් පහත දැක්වේ.

4) Back-end සාදාගැනීම.

Bank-end මගින් front-end හි ක්‍රියාකාරීත්වය සක්‍රීය කරන දත්ත හසුරුවයි. උදාහරණයක් ලෙස, Facebook හි back-end හි images ගබඩා වන අතර එමඟින් front-end හි අනෙක් අයට ඒවා බැලීමට ඉඩ සලසයි. එය ප්‍රධාන කොටස් දෙකකින් සමන්විත වේ:

a)Database - data store කිරීම, organize කිරීම සහ process කිරීම සඳහා වගකිව යුතු අතර data request ආ විට server මඟින් එය ලබා ගත හැකිය.

b) Servers - Data requests යැවීම, processing සහ receiving සඳහා servers වගකිව යුතුය. ඔවුන් database සහ client/browser අතර අතරමැදියෙකි. ඇත්ත වශයෙන්ම, browser මගින් සේවාදායකයාට "I need this information” යනුවෙන් පවසන අතර, දත්ත ගබඩාවෙන් එම තොරතුරු ලබාගෙන client ට යැවිය යුතු ආකාරය server මගින් සිදුවේ. Back-end developers මගින් මූලිකව ම logic code, database management හා infrastructure ස්ථාපිත කෙරේ.

5) Front-end සාදාගැනීම

Front-end හි දේවල් වැදගත් වන්නේ එය ඔබේ visitors, customers සහ users දකින දේ වන නිසා සහ ඔවුන් ඔබේ වෙබ් අඩවිය භාවිතා කරන්නේ කෙසේද යන්න නිසාවෙනි.

Front-end (client-side) හි JavaScript, HTML සහ CSS සංයෝජනයක් ඇතුළත් වේ. එය typography, fonts, navigation, positioning, browser compatibility හා responsiveness වැනි components ද පාලනය කරයි. මෙම කොටසේදී ඔබේ wire frame සහ initial site vision හි ඇතුළත් කර ඇති දේ වැඩි වැඩියෙන් පිළිබිඹු වේ.

6) Domain name එකක් ලබාගැනීම

මෙම අවස්ථාවේදී ඔබේ වෙබ් අඩවියට IP address එකක් ලැබී ඇත. එයට ඔබේ වෙබ් අඩවිය visitorsලා ට සොයා ගැනීමට පහසුවන unique Domain name එකක් ද අවශ්‍යයවේ. GoDaddy සහ Hover වැනි වෙබ් අඩවි සේවාවන් ඔබට domain name එකක් මිලදී ගැනීමට සහ ICANN (Internet Corporation for Assigned Names and Numbers) සමඟ ලියාපදිංචි වීමට උපකාරී වේ. මෙහිදී වසරකට registrations සිදුකෙරේ.

7) Website එක launch කිරීම.

Domain name එකක් සකසා එය ඔබේ host ට link කළ පසු, ඔබේ Website එක අන්තර්ජාලයට එළි දැක්වීමට බොහෝ දුරට සූදානම් ය. නමුත් ඊට පෙර ඔබේ කණ්ඩායමේ responsibilities බෙදා ගැනීම, site testing කිරීම, optimizing for SEO සහ final check කිරීම කළ යුතුය.

Tap below for further website development resources.

Website Development Resources

Tutorialspoint

egghead

Khan Academy

freeCodeCamp

Treehouse



Web Development Communities

Stack Overflow

Mozilla Development Network

Reddit

Dive Into Web Development


සටහන - පියුමිකා ගුණරත්න