เริ่มต้นผลงานแอพพลิเคชันแรก

เริ่มต้นผลงานแอพพลิเคชันแรก

ทุกครั้งก่อนที่จะสร้างแอพพลิเคชันใหม่ จำเป็นจะต้องทำสิ่งต่อไปนี้เสมอ เพื่อให้ผลการทำงานผิดพลาดน้อยที่สุดเท่าที่จะทำได้

1. สร้างไดเรกทอรี่เอาไว้ที่ Drive C:\ หรือ Drive D:\ ก็ได้ จากนั้นตั้งชื่อ ไดเรกทอรี่ตามที่ต้องการ แต่การตั้งชื่อมีกฏในการตั้งดังต่อไปนี้

1.1 เพื่อลดความผิดพลาด ควรตั้งชื่อเป็นภาษาอังกฤษ เท่านั้น เช่น "apptest"

1.2 ห้ามตั้งชื่อหรือมี "เว้นวรรค" เป็นส่วนประกอบ เพราะจะทำให้เกิดข้อผิดพลาดได้

1.3 อย่าพยายามใช้สัญลักษณ์ใดๆ

เพียงเท่านี้ก็จะทำให้ข้อผิดพลาดในการสร้างแอพลดน้อยลงไป ได้เยอะมาก

2. หลังจากสร้างไดเรกทอรี่แล้ว กลับเข้ามายัง Dreamweaver จากนั้นกดปุ่ม Site แล้วเลือก Manage Sites... เพื่อจัดการสร้างแอพพลิเคชัน

3. มีช่องให้กรอกข้อมูลอยู่ 2 ช่อง คือ

3.1 Site Name ให้กำหนดชื่อแอพลงไป

3.2 Local Site Folder ให้กำหนดไดเรกทอรีที่แอพจะเก็บข้อมูล

หลังจากที่กำหนดไดเรกทอรี่ของแอพแล้ว ก็จะนำมาสู่ขั้นตอนต่อไปคือ การเริ่มสร้างหน้าตาของแอพขึ้นมา โดย Dreamweaver CS6 ได้เตรียมรูปแบบเริ่มต้นเอาไว้แล้ว นั้นคือเราสามารถใช้รูปแบบเริ่มต้นเอาไว้ สิ่งมีประโยชน์มากสำหรับคนที่ยังไม่คุ้นเคยกับ การสร้างแอพ ให้สามารถมองเห็นภาพรวมได้ เพิ่มความรวดเร็วในการออกแบบอีกด้วย เริ่มเลยดีกว่า

4. เลือก File -- > New...

5. จะปรากฏ New Document ขึ้นมา ให้เราเลือกดังต่อไปนี้

5.1 เลือก "Page from Sample"

5.2 Sample Folder เลือก "Mobile Starter"

5.3 Sample Page เลือก "jQuery Mobile with theme (Local)"

5.4 DocType เลือก "HTML5"

จากนั้นกด Create เพื่อเริ่มกระบวนการสร้างตัวอย่าง ขั้นตอนนี้อาจใช้เวลาซักครู อาจดูเหมือนโปรแกรมหยุดทำงานแต่ให้รอซักครู่เท่านั้น ใช้เวลาไม่นาน

Author Note.
1. jQuery เป็น Javascript Framework โดยจะใช้เป็นส่วนหนึ่งของแอพ
2. สาเหตุที่เลือก "jQuery Mobile with theme (Local)" เนื่องจาก Dreamweaver จะทำการ copy ข้อมูลของ jQuery เอามาเก็บไว้ในไดเรกทอรี ที่เราได้สร้างขึ้นมา แทนการเรียกใช้ผ่านอินเตอร์เน็ต และทำให้เราสามารถ สร้างแอพได้โดยไม่จำเป็นต้อง ต่ออินเตอร์เน็ตตลอดเวลา

6. หลักจากที่กด Create แล้ว จะพบว่า Dreamweaver นั้นสร้างบางสิ่งบางอย่างขึ้นมาให้เราแก้ไขได้ วิธีการเรียนรู้การใช้งานที่รวดเร็วที่สุดคือ ทดลองแก้ไขข้อมูลของแอพและโค๊ดเท่าที่สามารถทำได้ จากนั้นค่อยๆค้นหาข้อมูลของ ภาษา HTML และทำการทดลองต่อไป

7. ก่อนที่จะทำการแก้ไขข้อมูลใดๆ จำเป็นต้อง Save ข้อมูลตั้งต้นเอาไว้ก่อน เลือก File --> Save As...

8. เลือก ไดเรกทอรีที่ต้องการ Save ไปยังที่ที่เราได้สร้างเอาไว้แล้วตามลำดับขั้นตอนแรกๆ

9. เมื่อกด Save แล้วจะมี Dialog Box แจ้งว่า กำลังจะทำการ Copy ไฟล์ข้อมูลที่เกี่ยวข้องไปเก็บไว้ร่วมกัน ให้ทำการกด Copy แล้วรอซักครู่

10. ขั้นตอนสุดท้าย ตรวจสอบว่า Dreamweaver CS6 แสดงผลการทำงานของแอพได้ เหมาะสมต่อการพัฒนาแอพหรือไม่ วิธีการคือ ให้กดปุ่ม "Split" และ "Live" เพื่อแก้ Code และแสดงผลการทำงานไปด้วย ทำให้สะดวกในการใช้งานไปอีกแบบ จากรูปจะแสดงให้เห็นว่า Code Zone อยู่ทางซ้าย และ การแสดงผลของแอพอยู่ด้านขวา

จุดเริ่มต้นในการสร้างแอพ ไม่ยากอย่างที่คิด ถัดจากนี้ ท่านสามารถสร้างใหม่ได้อีก เป็นร้อยเป็นพันโปรเจค แนะนำว่าให้ทดลองความสามารถของตนว่าจะสามารถแก้ไขแอพได้มากน้อยแค่ไหนจากนั้นจึงศึกษาในสิ่งที่ต้องการทำ 

การปรับแต่งโปรแกรม Dreamweaver ให้พร้อมสำหรับการสร้างแอพ

การปรับแต่งโปรแกรม Dreamweaver ให้พร้อมสำหรับการสร้างแอพ

1. เปลี่ยน Dreamweaver CS6 ให้พร้อมสำหรับการสร้างแอพ

เปลี่ยน Designer ให้กลายเป็น App Developer Plus  จะถูกเปลี่ยนเป็น Mode App Developer Plus ตามรูปด้านล่าง

2. การเปลี่ยน Font ของ Dreamweaver เพื่อให้สามารถแก้ไข Code ได้ง่ายขึ้น วิธีทำดังนี้ 

เริ่มจาก Edit > Preferance หรือ CTRL+U

 หลังจากที่ Preference ขึ้นมาแล้ว เลือก Font จากนั้นเปลี่ยนให้เป็นดังรูป

จากนั้นตอบ OK รอซักครู่ Code จะเปลี่ยน Font ให้สบายตาเหมาะแก่การสร้างแอพแล้ว

เท่านี้ Adobe Dreamweaver ก็จะพร้อมสำหรับการสร้างแอพแล้ว

How to install Dreamweaver CS6 for writing an Android app is easy - easy - fast [English]

How to install Dreamweaver CS6 for writing an Android app is easy - easy - fast.

Need to stop using the Internet is to be complete before the installation can be done by stopping the devices connected to the Internet. Including pulling the cable out first, then plug in the recommendations is the need to download the program, and before.

Download : Download Click 
1. Extract the downloaded program is shown below. 

2. Visit the SOFTWARE directory to find the file, double-click Setup.

 3. After quenching Berber-click it. The program will begin checking the availability of the machine. May be asked to Restart before.

 3. After passing step 3, the program will provide a form of installation, select Try If no Adobe's key.

 5. Click Accept to accept the terms of use.

 6. Choose a directory to install the program. 
(up to this point, some people may not be installed due to not disconnect the Internet is).

 7. Starting the installation program. Which in no time

 8. Finished install Adobe Dreamweaver CS6.

 9. Adobe Dreamweaver CS6 first lunch. 

10th. Respond OK to go through it.

 11th. Appearance of the program Adobe Dreamweaver CS6 and use.