Tags:

ใช้เครื่องมืออะไรพัฒนาและออกแบบ HTML5+CSS3 ครับ
ตอนนี้กำลังศึกษาด้านอยู่อยู่ เน้นไปทาง AJAX HTML5+CSS3
ในงานจริงๆนี่ Web Developer ทุกท่านทำงานกันอย่างไรครับ
ใช้ Text Editor เขียนทั้งหมดเลยไหม เขียนเสร็จ Save -> Refresh browser เพื่อดูผลลัพธ์เลยหรือเปล่าครับ
หรือมีเครื่องมีอะไรที่ทำให้การทำงานง่ายขึ้น
พวก Adobe Edge จำเป็นไหม คำถามเพียบเลย 555 ขอบพระคุณล่วงหน้าครับ

Get latest news from Blognone
By: itpcc
ContributoriPhoneRed HatUbuntu
on 23 April 2013 - 20:45 #564960
itpcc's picture

ใช้เครื่องมืออะไรพัฒนาและออกแบบ HTML5+CSS3 ครับ --> Sublime Text2 + NetBeans 7.0.2 ครับ
ใช้ Text Editor เขียนทั้งหมดเลยไหม เขียนเสร็จ Save -> Refresh browser เพื่อดูผลลัพธ์เลยหรือเปล่าครับ --> ส่วนใหญ่ใช่ครับ
หรือมีเครื่องมีอะไรที่ทำให้การทำงานง่ายขึ้น --> inspect element + stackOverFlow + JSBin ครับ
พวก Adobe Edge จำเป็นไหม --> ผมเองก็ไม่ทราบนะ แต่ผมว่าถ้าเป็นพวกอนิเมชันประกอบก็น่าจะจำเป็นล่ะครับ :)


บล็อกส่วนตัวที่อัพเดตตามอารมณ์และความขยัน :P

By: EThaiZone
ContributorAndroidUbuntuWindows
on 24 April 2013 - 11:25 #565238 Reply to:564960
EThaiZone's picture

ใช้เหมือนแบบนี้เลยครับ


มันไม่ง่ายเลยที่จะทำ GIF ให้มีขนาดน้อยกว่า 20kB

By: way_cs16
ContributorWindows PhoneAndroidBlackberry
on 24 April 2013 - 11:40 #565248 Reply to:564960
way_cs16's picture

ฮู้ววว ขอบคุณมากครับ ตอบละเอียดเลย

By: adente
ContributorSUSESymbianWindows
on 23 April 2013 - 21:25 #564982
adente's picture

notepad++ โล้ด เขียนไปเรีื่อยๆจะจำ syntax ได้ขั้นเทพเองครับ เลือก browser คู่ใจมาสักหนึ่งที่เราสามารถ inspect element มันได้ ก็แค่นี้แหละครับ

By: tontan
ContributorAndroidSymbianUbuntu
on 24 April 2013 - 16:16 #565365 Reply to:564982

+1 ผมใช้notepad++ กับ Firefox ครับ


บล็อก:wannaphong.com บล็อก Python 3

By: AMp
In Love
on 23 April 2013 - 21:49 #564989

IDE ใช้เป็น Sublime Text2 ครับ
ส่วน CSS3 นี่ใช้ SASS+Compass เป็นตัวช่วยให้เขียน CSS3 ง่ายขึ้น(อีกนิด)
เขียนเสร็จก็เซฟแล้ว Refresh ดูผลลัพธ์ตามปกติครับ

By: jirayu
ContributorWindows PhoneBlackberrySymbian
on 24 April 2013 - 04:39 #565126

เครื่องมือที่ใช้ หลักๆก็
- Notepad++ สำหรับแก้โค๊ด
- บรรดา Inspector ที่มากับเบราเซอร์ (แต่จะเน้นทำงานกับ Dragonfly บน Opera เป็นหลัก)
- FileZilla สำหรับ FTP
- Photoshop + Illustrator สำหรับงานที่ต้องแกะ PSD, AI

ขั้นตอนทำงานก็ เขียน > เซฟ > รีเฟรช > inspect ครับ

ส่วนพวกเครื่องมืออย่าง Adobe Edge จำเป็นมั๊ย ตอบได้เลยว่าไม่จำเป็นครับ แต่ถ้าใช้เป็นและคล่อง งานก็สะดวกกว่าการมานั่งเขียนโค๊ดเองมากครับ


By: kicub2
iPhoneAndroid
on 24 April 2013 - 10:41 #565211

edit+ , fileZilla , firebug , XAMPP

By: way_cs16
ContributorWindows PhoneAndroidBlackberry
on 24 April 2013 - 11:41 #565249
way_cs16's picture

ขอบคุณทุกท่านมากครับ น่ารักจริงๆ จุ๊บๆ

By: 9neo on 24 April 2013 - 12:04 #565263
9neo's picture

komodo edit ตัวเดียว เขียนเสร็จ เซฟ รีเฟรชบราวเซอร์

By: webapps
Windows
on 24 April 2013 - 12:36 #565289

Save -> Refresh browser ครับ เครื่องมือที่ใช้
1. Programmer’s Notepad (http://www.pnotepad.org/)
2. Server2go + Google Chrome

ตัวอย่างที่
http://www.siam-apps.net/

By: benjifx
ContributoriPhoneAndroidUbuntu
on 24 April 2013 - 16:15 #565363

ถ้าไม่อยาก refresh browser ก็ใช้ Netbeans 7.3 แล้วใช้ Chrome ลง extension ของ Netbeans เวลา save หน้าเว็บจะเปลี่ยนให้เลย
https://netbeans.org/kb/docs/web/html5-gettingstarted-screencast.html

By: way_cs16
ContributorWindows PhoneAndroidBlackberry
on 24 April 2013 - 16:57 #565376
way_cs16's picture

เพิ่งไปเจอ http://www.bracket.io ตัวนี้เอาไว้ทำ html+css มันส์มาก

By: PiKO
ContributorAndroid
on 24 April 2013 - 18:48 #565417

Netbeans ใช้ทำอะไรกันครับ ?

text editor ผมใช้ sublime text 2


:: DigiKin8 ::

By: EThaiZone
ContributorAndroidUbuntuWindows
on 24 April 2013 - 20:40 #565466 Reply to:565417
EThaiZone's picture

ทำหน้าที่ๆ IDE ทั่วไปควรทำครับ ได้แก่

  • แสดง autocompletion และ hint
  • ทำ refactor code
  • debug ขั้นสูงรวมกับระบบอื่นๆ (กรณี PHP คือ xdebug)

นอกนั้นก็มีอย่างอื่นอีกบ้างครับ แต่หลายอย่าง ST2 ก็ทำทดแทนได้นะ สำหรับผม ST2 ทดแทนได้เกือบหมดล่ะ ยกเว้น autocompletion ของ codeintel มันไม่แสดง hint ทำให้ที่เราเขียน phpdoc ไว้ซะละเอียดรู้สึกลดคุณค่าไปนิดหนึ่ง (autocompletion ของ NEtbeans มันดึง phpdoc มาแสดง)


มันไม่ง่ายเลยที่จะทำ GIF ให้มีขนาดน้อยกว่า 20kB

By: PiKO
ContributorAndroid
on 25 April 2013 - 08:08 #565651 Reply to:565466

ขอบคุณมากครับ ไว้มีโอกาสจะลองดูมั่ง


:: DigiKin8 ::

By: 13ankster
Symbian
on 25 April 2013 - 13:24 #565856
13ankster's picture

Netbeans กันเยอะ มันดีกว่า Eclipse หรือ Aptana ยังไงบ้างครับ ใครช่วยบอกที

ทุกวันนี้ใช้ Aptana กำลังเริ่มย้ายไป Sublime Text2 แล้วก็มี Notepad++ เอาไว้แก้ไฟล์บนเซิร์ฟเวอร์ จาก FileZilla อีกที

By: lucksad
iPhoneRed Hat
on 25 April 2013 - 17:38 #565962

ใช้ webstorm ครับ feature เยอะดีแต่ไม่ฟรี

By: cmpaisan
AndroidWindows
on 26 April 2013 - 15:06 #566289
cmpaisan's picture

เครื่องมือที่ใช้
- Appserve ทดสอบบนเครื่องตัวเอง
- Editplus เขียนโค๊ด
- Navicat ออกแบบฐานข้อมูล
- Firefox + Firebug ในการ debug เช็คโค๊ด
- Developer toolbar ตรวจการแสดงผล reponsive โดย resize on เลือกขนาดหน้าจอได้
- Php maker ในการรัน admin
Adobe Edge น่าใช้ดี แต่ไม่เคยใช้

By: bouroo
AndroidRed HatUbuntuIn Love
on 26 April 2013 - 18:51 #566375
bouroo's picture

Aptana + Google Chrome ครับ

ดูบ้านๆเลยผม

By: Similanblu
AndroidWindows
on 28 April 2013 - 11:19 #566745

ถ้าทำแต่ Front End อย่างเดียวก็ Aptana + Chrome จะต้องการอะไรมากกว่านี้อีก

ถ้าทำ Back End ไปพร้อมๆ กัน หรือต้องใช้ template language ก็เปิด Eclipse ที่ลง Web Development Tool แทน Aptana