Archive

Archive for the ‘HTML’ Category

Web design: Вебийн текст агуулга

December 2nd, 2011 2 comments

Facebook дээр нилээд дээр вебийн текст агуулгыг уншихад төвөгтэй талаар нэг зураг тавьж хэлэлцүүлж байсан билээ. Одоо уг сайтыг бас дахин жишээлэн ямар байвал зүгээр байгаа талаар энэ бичлэгийг оруулж байгаа юм.

 

Read more…

Form 3: Form validation

February 26th, 2009 13 comments

Энэ удаагийн form цувралаараа form validation буюу формын талбарууд дээрхи утгууд үнэн зөв, байх ёстой өгөгдлүүд нь байгаа эсэхийг клиент талд нь javascript ашиглан шалгах аргыг авч үзье. Ер нь веб програмчлалд үр бүтээлтэй, найдвартай, хурдан ажилуулахын тулд клиент талд javascript-ийг өргөн ашигладаг. Ийм ч учир javascript хэлний хэрэглээ, түүнийг ашигласан  фрамеворкүүд өнөөдөр хүчээ аван хөгжиж байна.  Энэ үйлдлийг сервер талд маш нарийн хийж болно (хийх ч ёстой). Бүх зүйлийг ганц сервер талд хийх биш клиент талд ядаж байх ёстой утгуудыг шалгачихдаг  байх хэрэгтэй юм. Энэ нь бүх юмыг серверт илгээн шалгуулснаас хурднаас гадна хэрэглэж байгаа хүндээ ч амар байдаг. Read more…

Form 2: PHP File upload

February 21st, 2009 23 comments

Хэрэглэгчийн комьютераас серверт  файл илгээх үйлдлийг  file upload гэдэг. Майлд файл хавсаргаж илгээх гэх мэт олон жишээ байна. Бид нарын одоо авч үзэх гэж байгаа жишээ бол Form -оор дамжуулан upload хийх арга юм. Үүнээс гадна FTP -ээр put хийж хуулах арга бас бий. Эдгээр нь веб програмчлал судлаж байгаа хүний заавал мэдэж байх зүйлүүд юм. Ингээд PHP -ээр файл upload хийх талаар жаахан тайлбартай жишээ хийе. Үүнийг myupload.php гэсэн нэг програмаар  хийе. Read more…

Categories: HTML, PHP/MySql Tags: , , ,

Form 1: PHP-ээр form боловсруулах нь

February 16th, 2009 5 comments

Энэ веб програмчлал эхлэн суралцагсдад нилээд чухал ойлголт гэж бодож байна. Их бага ямар ч веб ялангуяа веб application-ууд ядаж ганц формтой байдаг. Үүний тулд HTML form-оо сайн мэддэг байх хэрэгтэй. Иймд форм хүлээн авч боловсруулах тухай слайдуудыг эндээс татаж үзээд уг слайд дээр авсан жишээнүүдийг ажилуулж үзэн мөн татан авна уу. Слайдууд болон жишээг үзээд ойлгомжгүй зүйл байвал энд коммент бичиж үлдээнэ үү.

Жишээ 1 – Форм дээрх талбаруудын утгуудыг авах
Жишээ 2 – Олон checkbox -оос сонгогдсонг нь таних

дээрх 2 жишээний эх кодыг энд дарж татаж авна уу.

За тэгээд амжилт хүсье. Дараагийн цувралуудаар орж ирж байгаа мэдээллүүдээ байх ёстой мэдээлэл мөн эсэх (нууцлал хамгаалалтын хувьд), файл серверт илгээх (upload) за тэгээд regular expression энэ тэр гээд энэ жишээгээ баяжуулаад явах юм. Формны талбаруудаа гаргахдаа хүснэгт ашиглаагүй харин DIV тэгээд CSS ашигласан. Вебийн дизайнийг одоо иймэрхүү маягтай хийдэг болоод байгаа билээ. за за гол нь формоо сайн ойлгоод аваарай.

Categories: HTML, PHP/MySql Tags: , , ,

Apache веб сервер суулгах, тохируулах

January 26th, 2009 8 comments

Веб програмчлал эхлэн суралцах гэж байгаа залуучдын хамгийн анхны хийж сурах зүйл бол веб серверээ суулгах явдал юм. Windows XP, Windows 2003 server дээр Apache суулгах бас жаахан тохируулга хийх талаар товч тайлбарлая.

Юны түрүүнд веб сервер гэж юу болох талаар товч тайлбарлая. Веб сайтууд нь бүгд интернетийн ямар нэг сервер компьютер дээр байрлаж байна. Хүмүүс веб сайтын хаягийг өөрийн веб браузер дээр бичээд ентер дарахад уг веб сайтыг үзэх хүсэлтийг (http request) интернетийн холболтоороо дамжуулан уг вебийг байрлуулж байгаа серверт хүргэнэ. Уг сервер дээр саяны хүсэлтийг боловсруулах зориулалттай сервер програм хангамж ажиллаж байх бөгөөд түүнийг веб сервер гэнэ. Одоо бидний суулгах гэж байгаа Apache бол веб сервер юм. Веб сервер хэрэглэгчийн үзэх мэдээллийг сервер дээрээ боловсруулалт хийн тухайн хэрэглэгчийн үзэхийг хүссэн мэдээллийг бүрдүүлнэ. Боловсруулалтыг веб сервер өөрөө дангаараа хийгээд байхгүй харин боловсруулалт хийх сервер талын хэлний ажиллах орчин нь болж өгдөг. Жишээ нь PHP бол сервер талд ажилладаг веб програмчлалын хэл юм. Мэдээлэл нь өгөгдлийн санд хадгалагдсан байвал мөн өгөгдлийн санд холбогдож мэдээллээ авна. Энэ өгөгдлийн сан нь MySQL байж болох юм. Боловсруулалт хийгдсэн мэдээллийг хэрэглэгчид HTML (CSS, JS -тай) хэлбэрээр веб сервер буцаана. Үүнийг нь ерөнхийд нь response гэнэ. Иймэрхүү загвараар л дэлхий дээрхи бүх веб сайт ажиллаж байдаг. Харин веб сервер, сервер талын хэл, өгөгдлийн сан удирдах хэрэгслүүд нь өөр өөр байдаг. Бид нарийн хувьд веб серверээрээ Apache, сервер талын хэлээрээ PHP, өгөгдлийн сангаараа mySQL -ийг сонгон ашиглана. Энэ 3 бол хоорондоо маш нийцтэй ажилладаг ба веб програмчлал сурч байгаа хүмүүс үзэхэд тохиромжтой байдаг.
webserverl

1. Apache суулгах
http://www.apache.org/dist/httpd/binaries/win32/ Энэ хаягаар ороод апачийн хамгийн сүүлийн үеийн Windows installer MSI Installer Package хэлбэрээр татаж авна. Татаж авсан install-аа ажиллуулан суулгана. Ерөнхийдээ энгийн програм суулгаж байгаа мэт байна. Харин ганц 2 цонхон дээр тохируулга хийнэ. Доорхи цонхон дээр байгаа байдлаар бичиж өгнө. Apache 1

ерөнхийдөө ингээд next next finish. Анхаарах зүйл! Apache инсталл хийгээд дууссны дараа өөрийн сервисээ ачаалах үед виндовс блоклох уу гэж асууна энэ үед мэдээж unblock гэж сонгоно.

2. Ажиллаж байгаа эсэхийг шалгаж үзэх.
Юны түрүүнд виндовсийн цагны хажууд индаинуудын өдны зураг бүхий ажиллаж байгаа итгэх ногоон сумтай айкон гарсан байх ёстой. (Ер нь apache гэдэг бол америкийн индиануудын нэг том овог юм.) Хэрвээ тийм байвал Firefox-oo (FF -ийг хэрэглэцгээе) гаргаж ирээд хаяг бичдэг хэсэг дээр нь http://localhost гэж бичээд дарвал It’s worked гэсэн бичиг гарч байвал инсталл амжилттай боллоо гэсэн үг. Апачийн хуучин хувилбарууд бол мөн л нөгөө лого бүхий нэг хуудас харуулна.

3. Аpache дефаултаараа C:\Program Files\Apache Software Foundation\Apache2.2 фолдерт суусан байдаг. Энэ фолдерт htdocs гэсэн нэртэй фолдер байх бөгөөд энэ бол чиний суулгасан веб серверийн root юм. өөрөөр хэлбэл энэ фолдерт чиний хийж байгаа веб сайтууд байрлах ёстой гэсэн үг. Түрүүний http://localhost гэхэд энэ фолдер луу хандаад уг фолдерт байгаа index хуудсныг нээсэн гэсэн үг. Тэгэхээр энэ фолдерт шинээр нэг веб сайт хийхийн тулд нэг фолдер үүсгээд түүндээ веб сайтын файлуудаа хуулна. Тэгээд http://localhost/mywebsitefolder гэж хандахад чиний веб дуудагдаж гарч ирэх болно. Ингээд чиний компютер веб сервер хэлбэрээр ажиллаж эхлэлээ.

4. Ингээд суулгасны дараа одоо бага сага тохиргоо хийе. Веб хийж байхад htdocs фолдер C:\Program Files\Apache Software Foundation\Apache2.2 гэх мэт олон фолдерийн цаана байх нь хүндрэлтэй байдаг. Гэвч үүнийг сольж болно. Солихын тулд C:\Program Files\Apache Software Foundation\Apache2.2\conf доторхи httpd.conf файлыг нээнэ. Энэ дотороос DocumentRoot “C:\Program Files\Apache Software Foundation\Apache2.2\htdocs” гэсэн мөрийг хайж олоод өөрийн шинээр сонгосон фолдероо зааж өгнө. Жишээ нь DocumentRoot “C:\webserver\htdocs” гэх мэт. Энэ бичлэгийн доохно талд байгаа гэдэг дээр мөн адил сольж өгнө. Эдгээрийн нарийн ширийн учир начрыг цаг нь болохоор ойлгодог болноо.

Мөн үүний доохни байх DirectoryIndex index.html гэсэн мөрийг DirectoryIndex index.php index.html болгож өөрчлөнө. Энэ нь чиний хийж байгаа вебийн дефаулт хуудас нь index.php эсвэл index.html байх юмаа гэдэгийг зааж өгч байгаа юм.

Эдгээр өөрчлөлтүүдийг хийсний дараа идэвхжүүлэхийн тулд цагны хажууд байх нөгөө айкон дээрээ double клик хийж гарч ирсэн цонхон дээрхи рестарт товчийг дарна. Ер нь цаашид Apache -аас өөрөөс нь гадна PHP -ийн тохиргоонд өөрчлөлт ороход энэ үйлдлийг хийдэг байна.

Маргааш PHP суулгахыг бичие.

Жич: Энд ашигласан фолдеруудын нэр болон тохируулга миний компьютерт ажиллаж байгаа Apache 2.2.8 гэсэн хувилбарынх болно.

Categories: Apache, HTML, PHP/MySql Tags: ,

Web development timeline

January 2nd, 2009 No comments

Доорхи зурагнаас веб хөгжүүлэлтийн хэл, хэрэгсэлүүд хирхэн яаж үүсэж, хөгжиж одоо ямар хувилбар дээрээ явааг тодорхой сайхан харж болохоор байна. Вебийн үндэс болон веб програмчлал үзэх гэж байгаа оюутнууд юу үзсэн цаашид юу үзэхээ ёстойгоо клиент ба сервер талаар нь ялган харна уу. Зурган дээр дарж томруулж үзнэ үү.

Web Development Timeline by end of 2008

Web Development Timeline by end of 2008

Categories: CSS, HTML, Javascript, PHP/MySql Tags: , ,