Web site တစခမ ဘ တပ လ အရင လလ ကညက ရ အ င. ..

  
ဆက ပ စ web site တစခ တည ဆ ငမယဆရင ဘ တလအပမလ..? 
 
HTML,  CSS,  Java  Script  စတ တက  လမ   အ သခ ပ..  HTML  (HyperText  Markup 
Language)  သည  Web  page  တ  တည ဆ ကတ  နရ မ   ရ မယ  Markup  Language  တစခ ဖစပ တယ.. 
CSS  (Cascading  Style  Sheets)  က တ   HTML  ရ   elements  တ  content  တက  ဘယလ  display 
style  ပရမယဆတ က  design  ဆ ပ မယ က ငပ ဖစပ တယ..  ပ ခ ငတ က တ   ဗ ..  Web  page  တစခ  ပရင 
html  န လ  ပလရတယ  ကညရတ မလဘ   ပတန တယ ပ ဗ ..  အ တ   css  န တ ပ   ရ လက တ   design 
အ မငအရ  လ အ င  ရ လရတယ ပ ဗ ..  ပ တ   text  တ  ဘ တမ   သ မယ font  တကလ အတတ uniform 
ဖစ အ င  အလယတက  css  ကသ ပ ရ လကလ  ရတယ..  န ကတစခက  Java  Script..  ခ က န တ တ ပ မယ 
Web  Development  မ ဆရင  java  script  က  client  scripting  language  တစခအ နန   webpage  တက 
create  လပတ  နရ မ   သ ပ တယ.  HTML,  CSS  တက  javaScript  သ ပ   ပ င လ  update 
လပလရပ တယ..  ပ တ   data  calculation,  manipulation  တလ  လပ ပ ပ တယ..  User  န   interactive 
လပ ပ မယ က ငသည javaScript ပ ဖစပ တယ.. 
 
အခအ ပ က ပ သ တ  ၃  ခသည  client  ဘက ခမ   (Front  End)  မ   သ မယ က င တပ  ဖစပ တယ.. 
ဆက ပ စ  facebook  သ တယ  က န တ အ က ငန   login  ဝငတယဆရင  က န တ   timeline  က န တ   friend 
တ  တငထ တ က  ပ ပ ပ လမမယ..  တစ ခ သ  တစ ယ က  အ က ငန   ဝငလကရင တ   ဝငလကတ  သရ  
timeline,home  က  ပ ပ ပ လမမယ..  အ တ   ဆလခ ငတ က  လတင   ​www.facebook.com  ကသ သ လည  
login  ဝငထ တ  User  ပ မ   မတည ပ တ   ပမယ  data,  content  တက  မတညပ ဘ ..  Same  URL  က 
သ သ လ  အလ  user  ပ မ   မတည ပ   content  တ  page  က န  display  လပတ ပ  ဖစ ဖစ  ecommerce 
website  တလ  င ပ   င ခ   လပတ မ တမ   service  ပ လပ ဆ င ပ ဖ  အတကက   server  side 
language (Back End) တလအပပ တယ.. 
 
Back End အ နန သ ငတ Language တက တ   
● PHP 
● ASP 
● JavaScript 
● java (servlets) 
● Python  စသည ဖငရပ တယ..  ခက န တ တ  ဆ က မ က တ   Python  ရ   Web  Application 
Framework တ အ က င ပ ဖစပ တယ.. 
 
Python မ သ ငတ Web Application FrameWork တက တ အ ကပ အတင ပ ဖစပ တယ.. 
● Django 
● Flask 
● Tornado 
● web2py 
● Bottle 
● CherryPy 
● Falcon 
● Pyramid 
● TurboGears 
● Hug 
 ● and Other. 
အသ အမ ဆ   Framework  က တ   Django  န   Flask  ပ  ဖစပ တယ.  Django  က တ   ပ ပ  
အသ မ ပ တယ..  Django  က   Flask က သည  Free  and  Open  source  ဖစပ တယ..  သည နရ   မ  
တစခ ပ ခ ငတ က  FrameWork  ဆတ ကပ ..  FrameWork  ဆတ သည  Web Server  တ resource  တ 
API တ အတကလအပတ package တ component တ ပ င စပပ ဝင နတ ပ ဖစပ တယ.. 
 
ဟတ ပ..  ခ  Back  end  Programming  language အ နန  Python ကသ ပ မယ..  ပ တ  Framework 
က တ   Django  က  သ ပ   Simple  App  လ   ရ ကညက ရ အ င..  ပထမဆ   Django  က  install  လပပ .. 
Python 3 က သ ပ မယ.. 
## pip3 install django 

 
 
Install   လပ ပ န က  folder/dir  တစခ  တည ဆ ကပ ..  ဖဒ   ဆ ကထ တ   ပ မသ ပ  အကန  စစစည စည  
မငရတ ပ ..  
## ​mkdir [folder/dir Name] 
folder/directory ဆ က ပ သ ရင အထက ဝငလကပ  
## ​cd [folder/dir Name] 
အ န ကမ တ   ##  ​django-admin  startproject  [PROJECT  NAME]  န   project  တစခ  create 
လပလကပ ..  ## ​ls ဆတ command န  list ထတ ကညလကရင ကယတည ဆ ကခတ project folder  လ က 
မငရမ ပ ..  ခ အ ကကပမ တ   django-admin  startproject  cross_net_sites  ဆ ပ   create 
လပခတ မ cross_net_sites ဆတ folder လ ရ နတ ပ ..  
Django-admin  startproject  ဆတ  command  န   folder  ဆ ကတ မဟတဘ န ..  Project  တစခရ  မယ 
config files တ additional file တက တစခတည skeleton က က တည ဆ က ပ လကတ ပ    
 
  
 
Cd  န   cross_net_sites  ထက  ထပဝငလကရင  cross_net_sites  ဆတ  project  directory  န  
manage.py ဆတ ဖင လ က မငရမ ပ .. 

 
Cross_net_sites  ဆတ  project  directory ထက ထပဝငလကရင တ  __init__.py, setting.py 
, urls.py, wsgi.py ဆတ ဖင လ ၄ ခက တ ရမ ပ ဖစပ တယ..  
 
● Manage.py  ဆတ က  ..  က န တ တရ   Django project က manage လပ ပ ဖ သ ရမယ script file 
ပ ဖစပ တယ 
● Setting.py  က တ   Django  ရ   setting  တက  config  လပထ တ  code  file  တစခပ ..  App  တ 
database တ စတ တအတက ပငစရ ထညစရ ရရင ဒထမ လ config ခ ပ ရပ တယ 
● Urls.py  က တ   django  ရ   Table  of  content  လ ပ ရမယ  ဿမ က  ဘယ  route  ဘယ  request 
ဆရင တ ဘယက က င ပဆတ မ တ လပထ ပ ရမယ.. အ ကက တ ရမ ပ .. စတမပပ န .. 
 
ခဒ အ ကက  ပ လ က တ   layout  လ က  မငသ အ င ပထ တ ပ ..  ​Main  Folder 
(Cross_net_sites)  ထမ   ​manage.py  န   ​Project  Folder(cross_net_sites)  ဆတ ရပ တယ.. 
cross_net_sites  ဆတ  Project  Folder  ထမ မ    __init__.py,  setting.py  ,  urls.py,  wsgi.py  ဆတ 
ဖင လ ၄ ခက တ ရမ ပ .. မငသ အ ငလ ပနရင ပတ ပ .. 
 
  
ခ  django  web  framework  လ က  စ  run  ကညရ အ င  ..  Web  FrameWork  run  နတ  စကက 
Web  Server  တစခပ န ..  IP reachable  ရရင  က ကတ နရ က န စကရ  IP လ လမ ခ ပ   ကညလရတယ.. 
အခ တ   server  run  ပ   local  host  ရ   IP  ဖစတ  127.0.0.1  ကပ  ခ ကည ပ   local  test  လပလရပ တယ.. 
Server  run  ဖအတက  လအပတ  command  က တ   manage.py  ရတ  နရ ကသ ပ တ   ##  ​python3 
manage.py runserver​ လ ရ ပ enter ခ ကလကတ န server run န ပဆတ စ တက မငရမ ပ .. 
 

 
 
Server  Run  န ပဆ တ   test  လပဖ  Web  Browser  က န ပ တ   တစဆင ခ ကညပ ..  127.0.0.1 
or  localhost  ပ တ   port  က တ   8000  န   ခ ကညလကပ …  Browser  မ   localhost:8000 
လ ကရင တ   localhost  ဆတ  Domain  Name  က န  IP  က  resolve လပ ပ ဖလပ တယ.. 127.0.0.1:8000 
လ ကလကရင တ Domain Name က resolve စရ မလတ အတက ပ မနပ တယ.. 
  
အခဆရင  က န တ တရ   Django  Web  server  က  successfully  up  and  running  ဖစ နပ ပ.. 
Service က ဒ င ခ ငတယ ပတခ ငတယဆရင တ terminal မ ctrl+c ပလကယပ ပ..  
 
န ကတစဆင  ဖစတ  simple  app  လ   တစခ ရ ကညက ရ အ င..  Web  Site က  ခ လကရင Hello, 
world လ ပ အ င ရ ကည က ရ အ င… 
 
ခဒ နရ မ   တစခ ပ ခ ငတ က  Django  မ   သ တ  project  န   app  ဆတ  term  (အ ခ အ ဝ ) 
အ က င ပ ..  
➔ Project 
◆ Single project တစခသည website တစခကပ support ပ ပ တယ 
◆ Project တစခမ app တမ က ပ ဝင ငပ တယ 
➔ App 
◆ App တစခခ င စမ ကယပငလပ ဆ ငရမယ တ ဝန တ focust ထ ရမ တ ရပ တယ 
● Example ( for Online shop Website) 
○ App တစခသည User Authentication ပင က ကငတယ ပ တ   
○ န က  App  တစခသည  payments  ( င ပ ခ မ)  အပင က  တ ဝနယတ  
မ ပ ..  
ခ က န တ တ ရ မ က တ hello world ထတဖ လပ ပ မယ simple app လ ပ ပ.. 
 
ကစလကက ရ အ င  ..  manage.py  ရတ  Main  Folder  အ ကကသ ပ ..  ​##  python3  manage.py 
startapp  hello  ဆ ပ ကလကရင  hello  ဆတ  Folder  လ တစခထပ ပ လ ပ လမမယ…  ခလပသ တ 
ပစက တ   manage.py  ကသ ပ တ   hello  ဆတ  app  လ က  ဖနတ လကတ ပ ..  အလ  လပဖ  manage.py 
 န ကမ   startapp  ဆတ  parameter  လ   ထည ပ လကတ န   hello  ဆတ  app  အတကလအပတ  files  တ 
အ လ က hello ဆတ folder အ ကမ အကန auto ထည သ ပ တယ.. 
 

 
 
hello  ဆတ  folder  ထကဝင ပ   ဘ တရမလ  ဆတ က  ls  န  ကညလကရင  အ ကပ အတင  
files/folder တက တ ရမ ပ .. 
 
● __init__.py  က  ခသရ နတ  directory  က  Python  Package  directories  အ နန   Python  က 
ပ ပ မယ က ငပ  

● admin.py​ Django ရ admin page အတက လအပတ setting တပ ဝငတ ဖငပ  

● apps.py​ application အတက ရရမယ config တပ ဝငတ setting ပ တ file ပ  

● models.py  model  မ တ   class  တပ ဝင ပ တ   ..  Django  ရ   ORM  (Object-Relational 

Mapping)ကသ ပ တ   application  data  န   Database(SQLite, PostgreSQL, MySQL, etc) 
က map ခ တဖ လအပတဖငပ application data က န Database က convert လပ ပ မယ က ငပ  

● tests.py​ test class တ ပ ဝငတ ဖင ဖစပ တယ 

● views.py  HTML templates မ   ပသမယ data  တအတက လအပတ class  တ function  တ ရတ 

file ပ ဖစပ တယ 

 
app  တစခ  create  လပ ပ ပ  ဆတ န   Main  project  folder  အ က  settings.py  ရ  INSTALL_APPS ရ  
အ ကမ   hello.apps.HelloConfig  ဆ ပ ထညထ ပ ပ ..  ခလ  hello  world  ထတမယ  simple  app 
လ မ တ   ထညခ င   မထညခ င သည  ပဿန မရပ ဘ ..  ဒ ပမယ..  Database  တ  တစ ခ တမ က   error 
တကပ လမမယ..  ဘ လလဆ တ   settings.py  ရ   INSTALL_APP  ထကထညထ မ  Django  အ နန   သမ  
ပ ဝငတ app တကသမ မလပ ..  
 
hello  ဆတ က  app  folder  ရ   name  ပ .  apps.HelloConfig  ဆတ က  hello  folder  အ ကက  apps.py 
ထက HelloConfig က ပ ထ တ ပ .. အ လ ကသထ ရင အဆင ပပ တယ ;-) 
  
 
ဟတ ပ   hello,  world  ဆ တ လ   ထတဖ  ဘယက န  စက မလဆ တ ..  Views.py  က တ  စ ပ  
ရ လကက ရ အ င..  ပထမဆ   views.py  ထ  က  ဝငပ   က န တ က တ   linux  terminal  က နမ  vim/nano 
က န တစဆငဝငလကပ တယ.  
 
def​ ​printHello​(​request​):
return ​HttpResponse​(​"Hello, world"​)
 
အရငဆ   function  တစခ  define  လပလကပ ..  ခဒ  example  မ တ   printHello  ဆတ  function  တစခ 
create  လပလကပ တယ  သ န ကက  ()  ထက  request  ဆတ က  client  broswer  က နလ တ  request 
ကလကခဖပ ..  အ ကအ က င မ ရတ  က ငက တ  ဖတလကရငက သသ ပ တယ “Hello, world” ဆ  ပ  Http 
response  ပနမယလ ပ ထ တအတက reqest လ ရင Hello world က response လပတ မ page မ  Hello 
World လ က မငရမ ပ ဖစပ တယ.. အလ ရ ယန ရ ပလ ဆ တ .. မရ သ ပ ဘ .. :P 
Python ရ urls.py တက ပင ပ ဖလပ သ တယ..  
 

 
Django  မ   request  ရ ကလ ပဆတ န   urls.py  မ   ထ တ  setting  အတင   path  တက ကည ပ  
ပ ပ မ မ.. သ ပ ပင ကညက ပ စ.. တစပင ခ င က အ ကမ ကမဖတ ပ မ န ကတစပင က ဆကဖတပ … ;-) 
 
Main  Project  Folder  အ ကက  urls.py  မ   ပငရငလ  ရပ တယ..  အလမဟတပ  ..  app  တင အတက 
သကဆငရ   urls.py  တ  တည ဆ က ပ   Main  project  ရ   urls.py  မ   ပန န ပ လလ  ရပ တယ  အလ  app 
တင အတက urls တ ပန ဆ ကတ က manage လပရတ ပလယမယလ မငပ တယ.. က န တ အ မငပ . 
 

 
 
Hello  ဆတ  app  ရ   folder  အ ကမ   urls.py  ဆတ  file  လ တစခ  create  လပလကပ .  အ န က 
editor တစခန ဝင ပ အ ကမ အတင config ခ လကပ . 
 
from django.urls import path
from . import views

urlpatterns = [
path('',views.printHello,name='Helloworld")
]
 
အ ပ ဆ အ က င က တ   django.urls  မ   ရတ  path  က  import  လပ ပ ထ တ ပ .  ဒတယ  အ က င   ဖစတ 
from  .  import  views  ဆတ က..  From  .  မ   .(dot)  သည  ခလကရ  ရ နတ  current  directory 
ကရည န ပ တယ..  အ တ   ပ ခ ငတ က  ခလကရ  dir  အ က  views  က  import  လပပ မယလ  ဆလရင  
ဖစပ တယ.. 
 
urlpatterns  ဆတ က တ   ဘယ  url/route  လ ရင  ဘ ထတဆတ မ   ရ ထ ပ တ ပ ..  ခဒမ ဆ  path() 
ထမ   ရ ထ တ က ကညမယဆရင  ‘  ‘  သည  home directory (ip/domain name  ရ လကတ န   ပမယ page) 
..  request လ ရင  ခ ရမ မ က views ထက prinHello ဆတ function  လ ကပ  .. အ က င page မ  hello 
world  ဆ ပ   ထတမ ပ ..  Name  =  Helloworld  က တ   option  ပ   သက  page  အ ပ က  title  name 
ပဖ ရ ပ တ ပ .. 
 
  
ပင ပ ရင  save  ခပ ..  အလ  လပထ ယန လ  မရ သ ဘ ..  အ ပ မ လ  ပ ခတယ လ..  Main  project ရ  
urls.py  က န  app  ရ   urls.py  က  ပန န ပ ရမယဆတ   ခ  Main  project  ရ   urls.py  ဆသ ပ  ပန န 
ပ က စ..  

 
Main Project ရ urls.py မ default code တ ပ ပသ ပ .. ထပထညရမ က urlpatterns မ   
path(‘  ‘,include(‘hello.urls’)),  လ ထပထည ပ ယပ ပ..  ‘  ‘  သည  home  dir/  default  dir  က ပ တ ပ  
webpage  က  စဝငလကလ..  Default  ပရမယ  page  သည hello  အ ကက urls.py က သ ခ ပပ  လ config 
ခ ထ တ ပ .. Line2 မ path န ကမ include လ က တ import လပခ န  

 
 လတ တ  အကန  ပငဆင ပသ ပဆ တ   ##  python3  manage.py  runserver  ဆ ပ   server  က 
run ကည ပ web browser က န localhost (127.0.0.1) က default port 8000 န ခ ကညပ .. 
 

 
 
Default  page  အ နန   Hello,  world  က လ တ က  တ ရမ ပ ..  ဒအထရက မယ န ..  အဆ  hello  ရ  
views.py  မ က  ခလကရသည  သညအတင   Hello,  world  ဆ ပ   response  ပနထ တ ပ   အတ က  html 
ဖငတစခန အစ ထ ကညက ရ အ င.. 
 
ပထမဆ   Main  project  folder  အ ကမ   templates  ဆတ  folder  တစခ ဆ ကပ .. အ အ ကမ မ 
index.html  ဆတ  ဖငက  ထ ပ မယ..  ဒဖငတငမ  မဟတပ ဘ   မတရလယ  manage  လပရ  လယ အ င  folder 
အ ကမ သတသတ ထ လကပ .. 
 

 
 
အ  index.html  ထမ တ   <h1>Hello,  world…..</h1>  လပ  ရ ထ ပ တယ  HelloWorld 
ထတ ပ မယ  html  ကတ လ ပ ပ..  အ န ကမ တ   hello  ရ   views.py  မ   HttpResponse(“Hello,  world”) 
နရ မ   ..  render(request,  'index.html')  လ ပ င ပ ပ ..  ပ ခ ငတ က  index.html  ရတ  content 
တက  ဆငမယ  render  လပမယလ  ပ တ ပ ..  ဒ ပမယ  တစခရတ   အ  index.html  က  ဘယန မ   ရမန  
python Django အ နန မသ သ ပ ဘ .. 
 
  
 
Main  Project  အ ကက  template  ဆတ  folder  ထမ   index.html  ရ က င က  settings.py 
(Main Project) မ သ ပ ထည ပ ရပ မယ settings.py ရ ‘DIR’: [] ကရ လကပ အ န က  
‘DIR’: [os.path.join(BASE_DIR,  ‘templates’)]  ဆ ပ   ထညထ ပ လကရင  Base DIR(Main Project 
Directory) ထက tamplates ထမ သ ကညရမယဆတ က Django အ နန သသ ပ ပ 
 

 
 
အ န က  server  က  ပန  run  ပ   web  Page  ခ ကညလကရင တ   အ ကပ အတင   မငရရင Django 
Web Application FrameWork ကသ ပ HelloWorld က အ င မငစ ထတ ငသ ပ ပဗ … 
 
  
 
 
 
 
Have Fun !! 
Wish you all the very Best… 
 
Khant Phyo 
Core Network Team Leader @Ericsson MyanmarCo,.ltd 
+959442329009