Category: Web

Web

สร้าง Google Form ง่ายนิดเดียว

Post author By คิดสร้างสรรค์
Post date February 16, 2013
3 Comments on สร้าง Google Form ง่ายนิดเดียว

เริ่มต้นใช้บริการของ Google ด้วยการสร้างบัญชีที่ accounts.google.com หลังจากนั้น เข้าระบบอีเมล์ที่เว็บไซต์เดียวกัน สังเกตุทูลบาร์ด้านบนจะมีบริการอื่นๆ ของ Google เมนูที่สว่างกว่าเมนูอื่น คือบริการที่ใช้อยู่ปัจจุบัน (Gmail)

คลิกเลือก Drive เพื่อใช้บริการ Google Dive ซึ่งมีโปรแกรมสร้าง Form อยู่ด้วย

ข้อมูลที่เราสร้างขึ้นมาด้วยโปรแกรมต่างๆ ของ Google จะถูกเก็บไว้ที่ระบบคลาวด์ของ Google ถ้าต้องการเก็บข้อมูลไว้ที่เครื่องเราเองด้วย ทำได้โดยลงโปรแกรม Google Drive โดยคลิก Download Google Drive เพื่อดาวน์โหลดและลงโปรแกรมที่เครื่อง หลังจากนั้นเราสามารถ เชื่อมข้อมูลทั้งสองที่ให้ตรงกันได้ตลอด (Sync) เมื่อเราออนไลน์

คลิกปุ่ม CREATE จะเห็นโปรแกรมที่ Google มีให้ (มีเพิ่มขึ้นเรื่อยๆ ในอนาคต) หนึ่งในนั้นคือ Form ดังนั้นให้คลิกเลือก Form

Tags Google Drive, Google Form

Web

ประโยชน์จาก Google Form

การทำแบบสอบถาม ข้อสอบ หรือการลงทะเบียน ผ่านอินเตอร์เน็ต ไม่ใช่เรื่องยากอีกต่อไปแล้ว เมื่อใช้บริการของ Google Form ที่สำคัญ ฟรี!

Form เป็นโปรแกรมหนึ่งใน Google Drive ใช้สร้างฟอร์มหรือแบบสอบถามในหลายๆ รูปแบบ ทำให้นำไปประยุกต์ใช้ได้หลายอย่าง เช่น ทำข้อสอบ ทำแบบสำรวจ ทำแบบลงทะเบียนในการประชุม หรือลงบันทึกใช้ห้อง ยืมรถ ยืมหนังสือ ฯลฯ

ข้อดีของ Google Form นอกจากจะฟรีและใช้ง่ายแล้ว แบบสอบถามหรือฟอร์มนี้ ยังส่งถึงผู้รับได้หลายช่องทาง เช่น ใส่ฟอร์มหรือใส่ลิงค์ของฟอร์มเข้าไปพร้อมอีเมล์ นำฟอร์มไปใส่ไว้ในหน้าบล็อกหรือหน้าเว็บเพจก็ได้

เมื่อผู้รับกรอกข้อมูลเรียบร้อย (ไม่ว่าในรูปแบบใด) แล้วยืนยันส่งกลับ ข้อมูลจะส่งมายัง Google Spreadsheet ที่เชื่อมต่อกับฟอร์มนั้นๆ หลังจากนั้นสามารถนำมาข้อมูลมาทำรายงานสรุป หรือแสดงข้อมูลในรูปแบบกราฟฟิกก็ได้

Tags Google Drive, Google Form, Google Spreadsheet

Web

PHP 1

เรียนรู้ PHP ผ่าน Youtube จาก Thenewboston

วีดีโอนี้แนะนำภาษา PHP ย่อมาจาก PHP Hypertext Preprocessor เป็นชื่อย่อที่อยู่ในชื่อย่อตัวมันเองอีกที (Recursive acronym) PHP เป็นภาษาที่นิยมกันมาก มีข้อมูลมากมายให้ศึกษา สามารถดาวน์โหลดได้ที่ www.php.net

เว็บมีลักษณะเป็นเครือข่ายของคอมพิวเตอร์หลายๆ เครื่องเชื่อมต่อกัน การทำงานของเว็บอยู่ในรูปแบบที่เรียกว่า Server & Client โดยเครื่องที่ให้บริการเว็บเรียกว่า Web Server ส่วนเครื่องที่รับบริการเว็บเรียกว่า Web Client ซึ่งก็คือเครื่องที่เราเองกำลังใช้งานผ่านโปรแกรมเว็บเบราว์เซอร์

PHP เป็นภาษาหนึ่งที่ใช้เขียนโปรแกรมบนเว็บเพจ ซึ่งจะทำงานในฝั่ง Server ก่อนจะส่งผลลัพธ์มายังเบราว์เซอร์ของเรา (ฝั่ง Client) การพัฒนาเว็บโปรแกรมโดยทั่วไป มักทำที่เครื่องของเราเอง (เป็นทั้ง Web Server และ Web Client) โดยใช้โปรแกรมชุด XAMPP (หรือ WAMP) ซึ่งมีหลายโปรแกรมรวมกันสำหรับพัฒนาเว็บโปรแกรม เช่น Apache (Web Server) MySQL (Database) รวมทั้ง PHP ด้วย (ถ้าดาวน์โหลด XAMPP แล้วไม่ต้องดาวน์โหลด PHP อีกครั้ง)

เมื่อดาวน์โหลด (XAMPP) และติดตั้งเรียบร้อยแล้ว ให้เปิดโปรแกรม XAMPP Control panel คลิกปุ่ม Start ของ Apache และ MySQL เพื่อเปิดการใช้งานโปรแกรมดังกล่าว

เพื่อตรวจสอบการทำงานของ Web Server ให้เปิดเบราว์เซอร์ โดยพิมพ์ที่อยู่ (URL Address) 127.0.0.1/xampp/ หรือ localhost/xampp/ เพื่อเปิดเว็บเพจของโปรแกรม Apache ที่มากับ XAMPP

localhost เป็นชื่อที่อยู่ของเครื่องที่เรากำลังใช้งานอยู่ ซึ่งมี IP Address 127.0.0.1 เราสามารถใช้ชื่อหรือ IP Address แทนกันได้ในการระบุที่อยู่เว็บไซต์

เพื่อทดสอบการใช้งาน MySQL ให้พิมพ์ที่อยู่ localhost/phpmyadmin/ เพื่อเปิดเว็บโปรแกรม phpMyAdmin ซึ่งเป็นโปรแกรมใช้จัดการฐานข้อมูลของ MySQL

การเขียนโปรแกรม PHP สามารถเขียนด้วยโปรแกรม Editor อะไรก็ได้ เช่น Notepad++ จากนั้นบันทึกไฟล์ด้วยนามสกุล php (เช่น myfirstfile.php)

PHP มักเขียนแทรกเข้าไปในไฟล์ HTML และมีโครงสร้างดังนี้

<?php

คำสั่ง PHP

โฮมเพจ (Home page) ของเว็บไซต์ ส่วนใหญ่จะใช้ชื่อ index แต่จะมีนามสกุลอะไร ขึ้นกับโปรแกรมภาษาที่ใช้เขียน เช่น ถ้าใช้ PHP ก็จะได้ index.php ปกติโฮมเพจสามารถเปิดได้จากที่อยู่ของโดเมนเนม (Domain Name) ของเว็บไซต์ เช่น kidsangsan.com เมื่อไม่ระบุชื่อไฟล์ที่จะเปิด Web Server จะส่งโฮมเพจมาให้ ไฟล์โฮมเพจจะอยู่ในโฟลเดอร์หลักของโปรแกรม Web Server ซึ่งในกรณีของ XAMPP จะอยู่ที่โฟลเดอร์ C:\xampp\htdocs

ลองพิมพ์ที่อยู่ localhost เท่านั้นในเบราว์เซอร์ ดูซิว่าได้เว็บเพจอะไร

Tags PHP, XAMPP

Web

Python 1

เรียนรู้ Python ผ่าน Youtube จาก Thenewboston

วีดีโอนี้แนะนำโปรแกรม Python ซึ่งสามารถดาวน์โหลดได้ที่ Python.org โดยให้เลือกโปรแกรม Python เวอร์ชั่นล่าสุดสำหรับ Windows เช่น python 2.6.2 windows installer (หมายเหตุ Python 3.x กับ Python 2.x มีไวยากรณ์ไม่เหมือนกันหลายอย่าง ต้องระวังความเข้ากันได้ระหว่างเวอร์ชั่นที่ใช้ด้วย)

เมื่อดาวน์โหลดมาเรียบร้อยแล้ว ให้ติดตั้งโปรแกรม จากนั้นเปิดโปรแกรม IDLE จะเห็นเครื่องหมาย >>> รอรับคำสั่งสคริปต์ Python

เพื่อทดสอบการทำงาน ลองเขียนสคริปต์สั่งให้โปรแกรมพิมพ์คำว่า Hello, world! ด้วยคำสั่ง

print “Hello, world!”

“Hello, world!” เป็นข้อมูลแบบสตริง (String) ดังนั้นต้องใส่ในเครื่องหมายคำพูด (“ ”) เพื่อบอกให้รู้ว่าคำที่อยู่ข้างในเป็นข้อมูล ไม่ใช่คำสั่ง สังเกตสีที่ปรากฎของตัวอักษรก็ได้ สีจะแบ่งตามประเภท (สีส้มเป็นคำสั่ง สีเขียวเป็นข้อมูลสตริง สีฟ้าเป็นผลลัพธ์) ทำให้อ่านโค้ดง่ายขึ้น

วีดีโอนี้เกี่ยวกับการคำนวณข้อมูลตัวเลข ซึ่งมีสองชนิด คือ Integer (int) เป็นเลขจำนวนเต็ม กับ Float เป็นเลขทศนิยม การคำนวณจะให้ผลลัพธ์ตามชนิดของข้อมูลที่ใช้ การบวก (+) ลบ (-) คูณ (*) ดูจะไม่เป็นปัญหา แต่มาดูการหาร (/) กันหน่อย ปกติการหาร int/int เช่น 18/7 จะได้คำตอบเท่ากับ 2 โดยจุดทศนิยมจะถูกตัดออก ถ้าต้องการทศนิยม เลขเศษหรือส่วนต้องเป็นชนิด Float ดังนี้

float/int เช่น 18.0/7 หรือ 18./7 (มีแต่จุด . ละ 0 ไว้ ก็ถือว่าเป็น float เหมือนกัน) ได้ประมาณ 2.57
int/float เช่น 18/7.0 หรือ 18/7. คำตอบก็ได้ประมาณ 2.57
float/float เช่น 18.0/7.0 หรือ 18./7. ได้ประมาณ 2.57 เช่นกัน

โมดูลัส Modulus (%) เป็นการหารเอาเศษที่เหลือเป็นคำตอบ เช่น 9 % 4 = 1 ใช้กับตัวเลขทศนิยมก็ได้ เช่น 8.75 % .5 = .25

เลขยกกำลัง (**) เช่น 8**3 หมายความว่า 8 ยกกำลัง 3 = 512 ส่วน -5**4 = (-1)(5**4) = -625 ซึ่งไม่เหมือน (-5)**4 = 625 โปรดใช้ความระมัดระวัง!

Tags Python

Web

HTML 1

เรียนรู้ HTML ผ่าน Youtube จาก Thenewboston

ในวีดีโอนี้จะเห็นหน้าเว็บเพจของ Yahoo และโค้ดที่อยู่เบื้องหลังเว็บเพจที่สวยงามนี้ โดยส่วนใหญ่ของโค้ดที่ใช้เขียนคือ HTML ใช้เขียนกำกับเนื้อหา (Content) ที่ปรากฏอยู่บนหน้าเบราว์เซอร์ และบางส่วนเป็นโค้ด CSS ใช้สำหรับกำหนดรูปแบบและการจัดวางเนื้อหาบนหน้าเบราว์เซอร์

การเขียนโปรแกรมบนเว็บ ต้องอาศัยโปรแกรมพิมพ์เอกสาร เช่นในกรณีนี้ใช้Notepad++ เป็นโปรแกรมฟรีและดี มีคุณสมบัติหลายอย่างที่เหมาะสมในการเขียนโค้ดเว็บเพจ (และภาษาอื่นๆ ด้วย) สามารถดาวน์โหลดโปรแกรมจากเว็บไซต์ Notepad++ เลือก Notepad++ Installer แล้วติดตั้งโปรแกรม (ส่วนใหญ่กด Next, สุดท้าย กด Finish)

เริ่มต้นในวีดีโอตอนนี้ด้วยการเปิดไฟล์ใหม่ใน โปรแกรม Notepad++ เริ่มเขียนเว็บเพจแรกด้วยภาษา HTML ซึ่งประกอบไปด้วยแทค (Tag) ต่างๆ ใช้กำกับรูปแบบเนื้อหาที่จะปรากฏในเบราว์เซอร์ โครงสร้างของ Tag มี 2 แบบ

<ชื่อของ Tag> ข้อความ หรือ แทคอื่นๆ </ชื่อของ Tag> เช่น <p> Hello world </p> เป็นแทคพารากราฟ (paragraph) ใช้บอกลักษณะของข้อความว่าอยู่ในรูปแบบของบทความย่อหน้า
<ชื่อของ Tag /> เช่น <br /> เป็นแทคบอกให้ขึ้นบรรทัดใหม่

แทคแรกของเว็บเพจ จะเริ่มด้วยแทค Doctype เป็นแทคบอกตัวเบราว์เซอร์ว่าเอกสารนี้เป็นชนิดอะไร เช่น <!doctype html> บอกว่าเอกสารนี้เป็นไฟล์ html

โครงสร้างหลักของเว็บเพจจะอยู่ภายในแทค html ซึ่งประกอบด้วย 2 ส่วนหลักๆ คือ แทค head เป็นส่วนบอกข้อมูลให้กับเบราว์เซอร์ ไม่เกี่ยวกับเนื้อหา เช่นชื่อ title ที่ปรากฏบนส่วนหัวของเบราว์เซอร์ อีกส่วนคือแทค body เป็นส่วนเนื้อหา ที่จะปรากฏอยู่ในพื้นตรงกลางของเบราว์เซอร์ รูปแบบโครงสร้างพื้นฐานของเว็บเพจทั่วไปมีดังนี้

<html>

<head> ข้อมูลสำหรับเบราว์เซอร์ </head>

<body> เนื้อหาของเว็บเพจ </body>

</html>

เมื่อทดลองเขียนเว็บเพจแรกแล้ว ก็ทำการบันทึก ในชื่อ index.html ชื่อนี้เป็นชื่อหลักของหน้าโฮมเพจ โดยปกติถ้าเราพิมพ์ชื่อเว็บไซต์ เช่น http://www.bbc.co.uk เท่านั้น ไฟล์ที่จะเปิดคือ index.html (บางครั้งอาจใช้นามสกุลอื่น ถ้าพัฒนาด้วยภาษาอื่น เช่น PHP ก็จะได้ไฟล์ index.php แทน)

ไฟล์ที่บันทึกไว้ที่เครื่องสามารถเปิดผ่านเบราว์เซอร์ได้ด้วย (สังเกตที่อยู่จะเป็น file:///c:/… ตำแหน่งที่อยู่ของไฟล์ในเครื่อง) ดังนั้นสามารถทดสอบดูได้ว่าหน้าตาเว็บเพจที่เขียนขึ้นมามีหน้าเป็นอย่างไร

Tags HTML