The Dev Monkey

ตัวอย่าง พัฒนาการของ web developer/web designer

January 31, 2007 on 3:51 pm | In Developer | 1 Comment

ได้มีโอกาศอ่าน โจ้กของ developer อันหนึ่งที่นี่ “The Evolution of a Programmer” แล้วก็รู้สึกได้เลยว่านะ เทคโนโลยี ซึ่งควรจะเป็นสิ่งที่คิดค้นขึ้นมาเพื่อให้มนุษย์สบายขึ้นนั้น จริงๆแล้ว เมือมันยิ่งพัฒนามากขึ้น ชาว dev. อย่างเราๆก็ยิ่งลำบากขึ้นเท่านั้นเลยจริงๆ

ชั้นประถมหัดเขียนweb
hello.htm

Code (html)
Hello world!

Compatibility
- works in all browsers/text editors/you name it
- your dog can read it and your grandma can change it

web programmer เด็กปีหนึ่ง
hello.html

Code (htm)
Hello world!

Compatibility
- works in all browsers/text browsers/mobile
- your grandma can still change it with some effort

พอปีสอง
hello3.html

Code (html)
Hello world!

Compatibility
- works in all browsers/text browsers/mobile
- validates

ใกล้จบ เริ่มจะเก๋า
hello3.html

Code (html)
<meta content="text/html; charset=utf-8" http-equiv="content-type" />hello world!

Compatibility
- m3 d0n’t kn0w

พอจบออกมา เริ่มต้องเขียน server side script เลยหัดเป็น PHP developer
hello4.php

Code (php)
<?echo("Hello world!" );?>

Compatibility
- works in all browsers/text browsers/mobile
- PHP needed
- will validate until some other dumb developer changes a letter

PHP developer ที่พอเริ่มมีประสบการณ์แล้ว
hello5.php

Code (php)
<?phpinclude "inc/class_hello_world.php";$hello_world_class = &#038;New class_hello_world;$hello_world_class->display_hello();?>

inc/class_hello_world.php

Code (php)
<?phpclass class_hello_world{var $hello = ‘Hello world!’;function display_hello(){echo $this->$hello;return 0;}}?>

Compatibility
- works in all browsers/text browsers/mobile
- PHP needed (4, 5 recommended)

จากนั้น เริ่มรับงานคนเดียว เลยต้องเป็น web designer ด้วย
hello3.html

Code (html)
<font size="2" face="Arial" color="#800080">Hello world!</font>

Compatibility
- works in all browsers/text browsers/mobile
- can annoy any person on earth (so no user compatibility)

เริ่มมีงาน designer มากขึ้น เวลาทำอะไรก็ต้องดูดีขึ้น
hello3.html

Code (html)
<"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><link type="text/css" rel="stylesheet" /><span class="hello">Hello world!</span><span style="font-style: italic">css/main.css</span>.hello {font-family: Arial;color: #990066;}

Compatibility
- needs browser CSS support
- NN4+, IE4+, FF, Opera 3.6+
- will not apply style on some mobile browsers

ทำไปเรื่ิอยๆ เขาบอกว่า web ที่ดีต้องออกแบบด้วย CSS
hello_world_v03a.html

Code (html)
<"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><meta content="text/html; charset=utf-8" http-equiv="Content-Type" /><link type="text/css" rel="stylesheet" /><style media="all" type="text/css">@import "css/main.css";</style><style media="all" type="text/css">@import "css/bugfix.css";</style><!–[if lte IE 6]><style type="text/css" media="all">@import "css/bugfix_ie6.css";</style><![endif]–><!–[if gt IE 6]><style type="text/css" media="all">@import "css/bugfix_ie7.css";</style><![endif]–><link title="Mobile/PDA" media="handheld" type="text/html" rel="alternate" /><link type="image/x-icon" rel="icon" /><span class="hello">Hello world!</span>There should be 4 css files I won’t bother to write.

Compatibility
- compatible with “most modern browsers”
- somehow IE6,7,FF,Opera renders the text wrong
- how the hack would you maintain the CSS pages for every IE service pack (hint: hire another Professional CSS Front-End Architect)

จากนั้นการงานก้าวหน้า ได้เป็น manager กะเขาบ้าง
hello.doc
Hello world!
File > Export HTML page…

เลื่อนขั้นเป็น Manager ระดับกลาง
mail -s “Hello, world.” bob@b12
Bob, could you please write me a webpage that prints “Hello, world.”?
พอเป็น Senior Manager

% zmail jim
I need a “Hello, world.” page by this afternoon

ในที่สุดเมื่อได้เป็นเจ้าของบริษัท
Calls Senior Manager
- Where the fck is my hello world page? The meeting with the client starts in 10 minutes!

ที่่มา:http://wskills.blogspot.com/2007/01/evolution-of-web-developerdesigner.html

ย้ายที่เขียน

January 28, 2007 on 11:36 am | In Developer | No Comments

Tramadol Market

แนะนำ โปรแกรมเก็บ stat สำหรับ website ของคุณ PHPMyVisits

January 22, 2007 on 10:58 am | In Web Creation, software review | No Comments

เนื่องจากว่า หลังจากใช้ google analytics หรือ บริการเก็บบันทึกข้อมูลการ access web จากที่ต่างๆแล้วรู้สึกว่ามันไม่สามารถเก็บได้อย่างที่เราต้องการ จึงลองไปหาดูว่า มี scritp ตัวได้ทีจะช่วยในการเก็บและประเิมินสถิติ ที่สามารถนำมาลงและแก้ไขได้ใน host ของตัวเองเลยหรือไม่ จึงได้ไปเจอกับ script ตัวนี้ เลยอยากแนะนำให้กับคนอื่นๆกันครับ

PHPMyVisits

phpMyVisites is a free and powerful open source (GNU/GPL) software for websites statistics and audience measurements.

phpMyVisites gives a lot of information on websites visitors, visited pages, software/hardware utilization, etc… The GUI Interface is fun and practical. The installation is entirely automated and very simple.

Statistics are very complete and use many clear graphics to present data. The software is translated in more than 30 languages!

อ่านต่อ แนะนำ โปรแกรมเก็บ stat สำหรับ website ของคุณ PHPMyVisits…

วีธีการคิดค่าแรง Project สำหรับ freelances

January 18, 2007 on 11:56 pm | In PHP, Developer | 1 Comment

พอดีช่วงนี้มีน้องๆหลายคนมาถามว่า “ไปรับงานเขียนโปรแกรมฟรีแลนซ์มา จะคิดตังค์เขายังไงดีอ่ะ” ปกติ ตัวผมเองก็ใช้วิธีกะเอาเคร่าๆว่ายากง่ายแค่ไหนตามประสบการณ์ เลยไปค้นดูว่า มีวิธีคิดเป็นทฤษฎีอะไรอยู่บ้างไหมก็เจอมาตามนี้ครับ

วิธีง่ายที่สุด
1. คุณวัดค่าความสามารถของคุณเองขึ้นมาก่อนง่ายๆ ว่าเดือนหนึ่งคุณอยากได้เงินเดือนที่เท่าไร แล้วเอามาหาร 20 จะได้เป็น man/day
2. ลองคิดดูว่าจะใช้เวลากี่วันจึงจะทำให้งานเสร็จ เช่น หากไม่ใช้ Ajax ใช้เวลา 20 วัน แต่ถ้าใช้ Ajax ใช้เวลา 30 วัน แค่นี้เงินมันก็ไม่เท่ากันแล้ว
3. ใส่ค่า Overhead ในการทำงานเข้าไปเช่น ค่าเดินทาง ค่าไฟ ค่าโทรศัพท์ ค่าปวดหัว ฯลฯ ส่วนมากแล้วจะคิดเป็น 30% ของ 2 ส่วนแรก
4. เอาเงินที่ได้มาคูณกับ % ที่เราคิดว่าน่าจะเป็นกำไร เช่น อยากได้กำไร 30% ก็คูณเข้าไป

เ ท่านั้นก็จะได้ราคาโดยรวม ซึ่งราคานี้ยังไม่รวม Maintain นะครับ คุณต้องคิดต่อไปด้วยว่าจะคอยช่วย Support แก้งานอีกถึงเมื่อไร อาจจะแถมให้ Maintain ให้ 3 เดือน ก็เหมือนกับการการันตีของทั่วไป แต่หลังจากนั้นคิดเงินเป็นครั้งละ xxx บาท หรือเดือนละ xxx บาท ซึ่งโดยมากแล้วหากคิด support เป็นปีจะคิดเป็น 25% ของราคารวมครับ

อันนี้ เอามาจาก forum narisa โดยคุณ bomber ครับ

เมือลองไปดู website freelance ของทางเมืองนอกดู ก็ปรากฏว่าเขามีวิธีที่เป็นมาตราฐานอยู่หลายวิธีเหมือนกัน ผมรวมๆเอามาให้ได้ดังนี้ครับ

อ่านต่อ วีธีการคิดค่าแรง Project สำหรับ freelances…

เพลง Code Monkey

January 11, 2007 on 1:58 pm | In LiftStyle, Developer | No Comments

พอดีวันนี้ไปพบเพลงเพลงนึงแล้วชอบมากๆครับ เนื่อเพลงโดนใจผมมากๆ แถมยังเข้ากับ theme ของ blog นี้พอดิบพอดี เพลงชื่อว่า Code Monkey แต่งโดยคุณ Jonathan Coulton ครับ ส่วน music vdo นี้ตัดต่อมาจากเกมส์ world of warcraft โดยคุณ Mike Spiff Booth โดยดูได้ ที่นี่

ส่วนต่อไปนี้เป็นเนื่อเพลงครับ

อ่านต่อ เพลง Code Monkey…

A MySQL Cheat Sheet

January 10, 2007 on 5:23 pm | In PHP | No Comments

เอาไปอีกอันครับ อันนี้ไว้อ้างอิงเวลาใช้ MySQL ครับ

CSS Cheat Sheet เอาไว้อ้างอิงเวลาเขียน CSS

January 10, 2007 on 4:17 pm | In Web Creation, Developer | No Comments

เวลาจะเขียน CSS แต่ละทีนี่มันสับสนน่าดูเลยใช่ไหมอ่ะ มี syntax อะไรเต็มไปหมด อันไหนต้องก่อนอันไหนบ้างก็ไม่รู้ พิมพ์ Cheat Sheet อันนี้เอาไว้ดูสิครับ สะดวกดีมากเลยอ่ะ

Text Editor สำหรับ Developer

January 7, 2007 on 12:52 pm | In Developer | 9 Comments

อยากจะแนะนำ text editor อีกตัวหนึ่งสำหรับ ชาว developer ใช้กันครับ เห็นที่ dev. ชาวไทยเราหลายๆคนใช้กันอยู่ คงเป็น editplus วันนี้ จึงอยากมาแนะนำ text (code) editor ตัวอื่นๆกันบ้างครับ

pspad ตัวที่ผมใช้อยู่เป็นประจำและอยากแนะนำกันคือ PSPAD ครับ เป็น text editor ที่ออกแบบมาสำหรับ software developer โดยเฉพาะครับ ที่สำคัญและทำให้ดีกว่า editplus คือ มันเป็น freeware ครับ ทำให้ผมสามารถ download มาใช้ได้ทุกที่ที่ต้องการ feature สำคัญๆ ต่างๆ ที่เคยใช้ใน editplus ก็มีหมด แถมยังมี code browser ให้สามารถเลือกดู function, class, tag ต่างๆใน source code ที่ทำงานอยู่ได้อีกด้วย

feature อื่นๆ ของ PSPAD

work with projects
work with several documents at the same time (MDI)
save desktop sessions to later reopen all session files
FTP client - edit files directly from the web
macro recorder to record, save and load macros
search and replace in files
text difference with color-coded differences highlighted
templates (HTML tags, scripts, code templates…)
installation contains templates for HTML, PHP, Pascal, JScript, VBScript, MySQL, MS-Dos, Perl,…
syntax highlighting according to file type
user-defined highlighters for exotic environments
auto correction
intelligent internal HTML preview using IE and Mozilla
full HEX editor
call different external programs for different environments
external compiler with output catcher, log window and log parser for an “IDE” effect in every environment
color syntax highlight printing and print preview
integrated TiDy library for formatting and checking HTML code, conversion to CSS, XML, XHTML
integrated free version of the top CSS editor TopStyle Lite
export with highlight to RTF, HTML, TeX format to file or clipboard
column block select, bookmarks, line numbers, …
reformat and compress HTML code, tag character case change
line sorting with ability to sort on defined columns and drop duplicates
ASCII chart with HTML entities
Code explorer for Pascal, C/C++, INI, HTML, XML, PHP and more in development
spell checker
internal web browser with APACHE support
matching bracket highlighting
…(many more features, too numerous to list)

นอกจากนั้น ผมยังเอา ตารางเปรียบเทียบ คุณสมบัติของ text editor สำหรับ developer หลายๆเจ้ามาฝากครับ resource มาจาก http://en.wikipedia.org/wiki/Comparison_of_text_editors

อ่านต่อ Text Editor สำหรับ Developer…

คำตอบ 20 อันดับแรก ที่เราเหล่า Programmer มักจะตอบทีม Test เมื่อโปรแกรมที่เราทำมีปัญหา

December 15, 2006 on 6:06 pm | In Developer | 4 Comments

นับถอยหลังกัน……
20. “That’s weird…”
“แปลก….”

19. “It’s never done that before.”
“ไม่เห็นมันเคยเป็นอย่างนั้นเลยนี่หว่า”

18. “It worked yesterday.”
“เฮ้ย เมื่อวานมันใช่ได้นะ”

17. “How is that possible?”
“เป็นไปได้ไงอ่ะ”

16. “It must be a hardware problem.”
“เครื่องนั้นมันเสียแหงมๆ”

15. “What did you type in wrong to get it to crash?”
“นายพิมพ์อะไรผิดอะดิ”

14. “There is something funky in your data.”
“Data ที่นายใช้ต้องมีไรแปลกๆไม่ปกติอะดิ”

13. “I haven’t touched that module in weeks!”
“เฮ้ย! กรูไม่ได้แตะต้องส่วนนั้นของโปรแกรมมาหลายอาทิตย์แล้วนะโว้ย (ไม่ใช่ความผิดกรูแน่ๆ)”

12. “You must have the wrong version.”
“นายทดสอบผิดเวอร์ชั่นอ่ะเป่า”

11. “It’s just some unlucky coincidence.”
“อ๋อ เพราะนายดวงไม่ดีอ่ะ ลองอีกทีไม่เป็นหรอก”

10. “I can’t test everything!”
“มันก็ต้องเสียอ่ะดิ ตูไม่ได้ลองทุกอย่างนี่หว่า”

อ่านต่อ คำตอบ 20 อันดับแรก ที่เราเหล่า Programmer มักจะตอบทีม Test เมื่อโปรแกรมที่เราทำมีปัญหา…

คู่มือการเลือกภาษาที่จะใช้โปรแกรม เปรียบเทียบกันแบบเห็นภาพไปเลย

December 15, 2006 on 6:02 pm | In Developer | 1 Comment

Programming languages ในปัจจุบันนั้น มีมากมายจนยากที่จะตัดสินใจจะเลือกคบกับภาษาใด ในทางกลับกัน การที่ผู้ชายเราจะดูว่าเราจะเลือกคบกะสาวแบบไหนนั้นง่ายกว่ากันเยอะ ดังนั้นเราจะมาลองดูว่า ถ้าภาษาต่างๆเหล่านี้่เป็นสาวๆ จะเป็นสาวแบบใด

Assembler - สาวนักวิ่งผู้ครองสถิติโลกคนปัจจุบัน, เธอออกจะแข็งและหยาบกระด้างอยู่บ้าง เธอสามารถปรุงอาหารแบบใดให้คุณก็ได้ทุกประเภท ทุกชาติ แต่ก็ต่อเมือคุณมีคู่มือการทำอาหารนั้นแบบสุดยอดละเอียดเท่านั้น เธอไม่ได้สวยหรือมีการศึกษาดี สามารถคุยกับคุณได้แต่คำศัพท์พยางค์เดียวอย่าง “MOV, JUMP, INC”

COBOL - สาวเลขาหน้าห้อง, เธอพูดมาก และสิ่งที่เธอพูดส่วนมากไม่จำเป็นต้องสนใจ เธอทำงานได้หนัก และทำงานได้นานๆติดต่อกัน แต่เธอไม่สามารถทำอะไรที่ซับซ้อนเกินไปได้ เธออารมณ์ร้อน และ ไม่สามารถคาดเดาได้ ทำให้ไม่ค่อยมีใครอยากทำงานกับเธอ เธอสามารถทำอาหารให้กับครอบครัวใหญ่ๆได้สบาย แต่อาหารที่เธอทำได้ก็มีแต่พวกข้าวไข่เจียว

BASIC - แม่ม่ายสาวไฟแรงข้างบ้าน, เธอเก่งในการหว่านเสนห์ให้หนุ่มน้อยรู้สึกหลงไหล สอนให้หนุ่มๆเหล่านั้นหลายคนได้มีประสบการณ์ครั้งแรกที่ดี หรือต่อให้ไม่ค่อยดีมันก็ยังคงเป็นครั้งแรก หนุ่มน้อยเหล่านั้นอาจยังไม่มีสิ่งใดมาเปรียบเทียบ แต่เธอเองจะค่อนข้างมีอายุแล้ว แต่เธอจะยังคงเป็นครั้งแรกที่น่าจดจำของเหล่าหนุ่มน้อย ความสามารถในการอาหารของเธอนั้นแค่พอใช้ และส่วนใหญ่จะไม่ดีพอ ที่น่าแปลกใจก็คือ คุณพ่อส่วนใหญ่จะยังคงแนะนำให้ลูกชายตัวเองได้รู้จักกับแม่ม่ายคนนี้ แต่คุณพ่อที่มีคุณธรรมบางคน จะแนะนำให้ลูกรู้จักกับสาวนิสัยดีอย่าง น้อง pascal มากกว่า

C - สาวนักบริหาร, สาวผู้กระฉับกระเฉง สุขภาพดี และไม่พูดมาก ทำกับข้าวเก่งโดยเฉพาะอาการเผ็ดๆ แต่เมื่อไหร่ที่คุณพูดอะไรโดยไม่คิด คุณจะทำให้เธอโมโหได้อย่างง่ายได้ น้องสายเธอ C++ นั้นอาจจะยังเด็กและไร้เดียงสา แต่ดูท่าทางเธอจะเติบโตเป็นผู้หญิงที่ดี ดูเป็นการเป็นงานมากกว่า และไม่อารมณ์ร้อนเหมือนพี่สาวเธอ

Pascal - คุณครูภาษาไทย, เธออาจจะสวยและน่ารัก แต่เธอจู้จี้และขี้บ่น เธอจะทำอาหารได้ดีก็ต่อเมื่อคุณจัดครัวให้เธออย่าเป็นระเบียบเท่านั้น

LOGO - คุณครูประถม, เธอเป็นคุณครูใจดีที่คุณจะอยากเป็นลูกศิษย์เมื่อตอนเด็ก เธอหลักแหลมและใจเย็น แต่เธออาจไม่ใช่คู่สนธนาที่น่าสนใจนัก เธอสามารถทำขนมแสนอร่อยให้เด็กๆกินได้ แต่เธอทำอาหารจานใหญ่ๆให้คุณไม่ได้หรอกนะ

Java -สาวท้วมอกโต, สามารถทำให้คุณได้ทุกอย่างแต่อย่างช้าๆนะ ไม่เคยบ่นไม่ว่าคุณจะต้องการแบบไหนบนเตียง ไม่ใช้ผู้หญิงเซ็กซี่แต่สามารถมอบความสุขให้คุณได้แบบไม่น่าเชื่อ ต่อให้คุณมีสาวๆให้ควงหลายคน สาวคนนี้ก็จะยังคงทำให้คุณต้องกลับไปหาเธอได้เสมอๆ

PHP - สาวหุ่นผอมเพรียว, พกพาไปไหนได้ง่าย สามารถสร้างความประหลาดใจให้แก่คุณได้ด้วยร่างกายเล็กๆของเธอ แม้จะไม่เซ็กส์ซี่แต่ก็สมส่วน เธอเป็นผู้หญิงแบบที่ผู้ชายอยากแต่งงานด้วย แต่คุณคงจำเป็นต้องจ้างแม่บ้านมาดูแลบ้าน เพราะเธอนั้นไม่สามารถทำงานหนักๆได้

Ruby on Rails. สาวหน้าใหม่ในเมือง, ทุกคนพูดถึงเธอ แต่ด้วยความที่เธอหน้าใหม่ มีแต่คนใจกล้ามากๆเท่านั้นที่จะกล้าชวนเธอคุย เธอดูดีและดูทันสมัย มีข่าวลือมากมายเกี่ยวกับความสามารถบนเตียงของเธอ แม่เธอจะไม่ค่อยพูดแต่ก็ดูเป็นสาวฉลาดมากๆทีเดียว

C# - สาวขี้โกงข้างบ้าน, เธอลอกทุกๆอย่าง ตั้งแต่สูตรอาหารยันการแต่งตัว เธอไม่เคยคิดอะไรเอง แต่ลอกความคิดสาวอีื่นแล้วบอกทุกคนว่าเป็นคนคิดเอง หนุ่มๆที่ไม่รู้ความจริงมักคิดว่าเธอฉลาดมาก เธอเป็นคนพูดมากและชอบแสดงออก แต่ก็มีบางทีที่เธอสามารถทำสิ่งที่เธอลอกได้ดีมากกว่าคนต้นคิดจริงๆมากนัก

The Dev Monkey

Comic of the day

ตัวอย่าง พัฒนาการของ web developer/web designer

Spread the Word

ย้ายที่เขียน

Spread the Word

แนะนำ โปรแกรมเก็บ stat สำหรับ website ของคุณ PHPMyVisits

Spread the Word

วีธีการคิดค่าแรง Project สำหรับ freelances

Spread the Word

เพลง Code Monkey

Spread the Word

A MySQL Cheat Sheet

Spread the Word

CSS Cheat Sheet เอาไว้อ้างอิงเวลาเขียน CSS

Spread the Word

Text Editor สำหรับ Developer

Spread the Word

คำตอบ 20 อันดับแรก ที่เราเหล่า Programmer มักจะตอบทีม Test เมื่อโปรแกรมที่เราทำมีปัญหา

Spread the Word

คู่มือการเลือกภาษาที่จะใช้โปรแกรม เปรียบเทียบกันแบบเห็นภาพไปเลย

Spread the Word

Categories:

Archives:

Meta:

Comic of the day

Spread the Word

Spread the Word

Spread the Word

Spread the Word

Spread the Word

Spread the Word

Spread the Word

Spread the Word

Spread the Word

Spread the Word

Categories:

Archives:

Blogroll

Meta: