วันพุธที่ 17 กันยายน พ.ศ. 2557

Jquery mobile on website for beginning developer #3

Site set up , manage site and Server set up for jQuery Mobile Project(#3) .

Site set up
                Site set up is menu to support user can manage site and easy to choose files in project to make new or edit.

Site set up : Open Dreamweaver CC. This tools useful to development website or website on mobile. Look at menu bar click Site -> New site(1). Next step input your site name(2).
Also select your Local Site Folder  
(3) -> Choose Root Folder (4).
Finally, click Save (5)to save your site.


Manage site

                Manage site is menu to manage site and server . When user will import site or manage site just move your mouse on menu bar Site -> Mange site


Server set up

                In Dreamweaver developer can set up server name for run your project file. When you set up finished you can click preview and show your output in browser. That it’s easily useful to developer.
But in example I just set up site for “Local/Network” to run on my laptop.
Let’s start!!!



 The first click on menu bar “Site -> New site...” And click Servers Tab(1).
Next , Click (+) symbol for add new server.

Also , Input your Server Name , Connect using (Choose “Local/Network”) , Server Folder (Browse in your project directories) and input web URL. 

Finally , when set up server success you just open some file and
click menu bar “File -> Preview in Browser -> your browser” or click world icon and choose your browser to preview input.

วันจันทร์ที่ 8 กันยายน พ.ศ. 2557

Jquery mobile on website for beginning developer #2

Hey! Guys today I will talk about jQuery mobile is framework for help to development website for the best design on mobile , tablet and desktop computer.

Lesson 2(#2): Set up jQuery Mobile for reference path to use.

                jQuery Mobile is  framework to include from HTML , CSS (Case Cade Stylesheet) and JavaScript. By library source code to people to develop website for mobile (smart phone), tablet and desktop computer. jQuery has prefect to show data on  interface for user. Because they’re designed to make responsive website and apps for easy response between user and mobile.

Solution for set up jQuery Mobile source code has two method

The first solution: Download jQuery Mobile source code from website (http://jquerymobile.com/download/) and copy source code to your local server (localhost). Next reference library or class in your project code file.


Figure 1:  Download jQuery Mobile source code from website  (http://jquerymobile.com/download/)


Figure 2:  Extract and copy jQuery Mobile source code to your project folder on server (localhost).
For example ,I copy jQuery Mobile folder to my project that name is “pingpong_traing” .


Figure 3:  Reference or call Jquery Mobile class.


The second solution: Reference or class path file with hosed file on website (CDN: Content Delivery Network). Copy source code from host CND enter website url: http://jquerymobile.com/download/ for reference class. Then copy source code and paste  in <head> tag of HTML.

Figure 4:  Copy-and-Paste snippet for jQuery CDN hosted files.

_______________________________________________

"CEPONGz is Developer , Not! programmer."

วันจันทร์ที่ 1 กันยายน พ.ศ. 2557

Jquery mobile on website for beginning developer

Jquery mobile on website for beginning developer (เจคิวรี่โมบายบนเว็บไซต์ สำหรับผู้เริ่มพัฒนา)

Jquery mobile



1. Prepare tools for Develop (เตรียมของให้พร้อมก่อนลงมือ)
  •  Adobe Dreamweaver CC 13 
  • appserv-win32-2.5.10 (Appserv)
  • jquery-mobile (Link)
  • Opera_Mobile_Emulator_12.1_Windows (Opera)
Download all tools : [Google Drive]

2.Install tools
  •  "Adobe Dreamweaver CC 13"
    This tool is easy install to your computer. Because  "Adobe Dreamweaver CC 13"
    that it's  install  like common program.
    For Example ,
    Click on "Next" button is first step.
    Then select path or directory to set up program.
    Finally waiting to install and load data of program. And click "Finished" or "Close" when installed program.
    การลงโปรแกรม   "Adobe Dreamweaver CC 13" นั้นสามารถลงได้ง่ายเหมือนโปรแกรมอื่นทั่วไปๆ คือ ... คลิก "Next" เลือก "Path/Directory" คือเสร็จ จริงๆ ไม่ได้โม้
  • appserv-win32-2.5.10 (Appserv
    This tool can search with google search engine.
    ลง Appserv ไม่ขอกล่าวถึงพี่กูมีหาอ่านได้ เอิ๊กๆ
  • jquery-mobile (Link
    Just download and copy to site or you project path.
    โหลดมาเก็บไว้ก่อนค่ะ แล้วค่อยเอาไปใส่ในโปรเจคเรา
  • Opera_Mobile_Emulator_12.1_Windows (Opera)
    This tool can install same another common program.

วันอังคารที่ 26 สิงหาคม พ.ศ. 2557

Useful Google Tools

Useful Google Tools  (สารพัดประโยชน์กับพี่กู)

  1. Google สำหรับเรา มันคือสิ่งมหัศจรรย์ ที่ทำให้เราทำโปรเจค กับ เรียนจบก็ว่าได้ กูเกิ้ลคือเพื่อนยาก นอกจากคู่โปรเจคแล้ว อิอิ ขอโทษน่ะเจ้ บทความนี้เป็นบทความแรก
เริ่มจากอะไรง่ายๆ ก่อน พอดีงานที่ทำมีความเกี่ยวข้องกับ web developing ทั้งไหนจะเป็น Administrator ของ CMS อย่าง JOOMLA (จูบลา เห้ยย.. จูมลา)  เนื่องจากต้องทำ SEO เพื่อให้ google เก็บ meta , keywords พวกนี้ ในหน้าเว็บจึงจำเป็นต้องเปลี่ยน URL / mod rewrite ไรงี้ให้เป็นภาษาไทย Ex. www.xxx.ac.th/contact.php -> ww.xxx.ac.th/ติดต่อ  พอนำ URL ไปแชร์ใน Social Media อย่าง Facebook มักจะได้ลิ้งตัวยาวๆๆๆ มา
(Ex.http://music.msu.ac.th/index.php/home/workgroup/%E0%B8%87%E0%B8%B2%E0%B8%99%E0%B8%9A%E0%B8%B8%E0%B8%84%E0%B8%84%E0%B8%A5) ประมาณนี้  ดังนั้น เครื่องมือแรกที่เป็นประโยชน์มากก็คือ "GOOGLE URL SHORTENER" 



  1. มาแปลง URL ให้สั้นลงดีกว่า กับ GOOGLE URL SHORTENER

จุดประสงค์หลักของ Tools นี้ก็คือ การแปลง URL ให้สั้นลง หรือ Friendly ต่อผู้ใช้นั้นเอง

ปล.ขอใช้ English ปนพี่ไทยน่ะครัช เพราะ เจ้าของบล็อคต้องสอบ  IELTS

  • Next :  Copy your URL  website

  • Third : Paste url in textbox and Press at "Shorten URL" button. Also let's see! new url and copy to use ot share in social media.


จบแล้ว ... คิดว่าน่าจะมีประโยชน์ ต่อผู้ที่สนใจ มั้ง ไม่รู้ 55555+