สอนเขียนโปรแกรมภาษา C++ เบื้องต้น : ตอนที่ 1 พื้นฐานสุดๆ

หนึ่งในความฝันเล็กๆที่อยากจะเห็นในอนาคตของผมคืออยากให้เด็กไทยรู้ภาษา Computer เป็นภาษาที่ 3 (รองจาก ภาษาไทยและ อังกฤษ) และพอดีเนื่องจากว่าเมื่อวานผมว่าง เลยลองทำ VDO สอนเขียน C++ ตอนแรกออกมาให้เพื่อนๆน้องๆได้ลองดูกันนะครับสำหรับคนที่สนใจหัดเขียน หวังว่าจะช่วยเติมความฝันของผมได้นะ 55+

ติชมกันได้เลยครับ

Windows 10 – Universal Windows Platform ขอลองซักนิด

เนื่องจากว่า Microsoft โปรโมทนักหนากับ Universal Windows Platform (UWP) ที่เมื่อเขียนแล้วสามารถนำไปรันบน Windows 10, Windows Phone, Xbox, etc.. ซึ่งน่าจะเป็นการพลักดันครั้งสำคัญของ Microsoft ในการสร้าง Eco System ให้กลับมาแย่ง Market Share อีกครั้ง

โดยส่วนตัวแล้วผมก็มีประสบการณ์กับ C# + WPF มาพอสมควรทำให้ปรับตัวได้ไม่ยาก และ  UWP น้ันมี Architect เดียวกับ WPF ในการทำ User Interface.

เริ่มจาก

  1. Install Visual Studio 2015 Community Editoin ซึ่งใช้งานได้ Free 🙂
  2. สร้าง Project ใหม่เป็นแบบ UWP

newproj

3. ไฟล์ที่ถูกสร้างมาจาก UWP project ก็คุ้นหน้าคุ้นตา MainPage.xaml อีกแล้ว..

default_files

4. ลองมาดู Project Properties..ก็พบว่าเราสามารถ target App ของเราได้ตาม Windows 10 Build version

project_prop

5. มาดูฝั่ง XAML กันบ้าง ซึ่งตัว code ที่ Visual Studio สร้างมาให้ก็เป็นแค่หน้าจอขาวๆ

xaml_code.png

6. พวก Default Controls ของโลก WPF ก็ยังมาอย่างครบครัน

system_controls

7. ลองใส่ Button ดูก็ลอง ลาก แล้วก็วางได้เลย

xaml_code2

8. ลอง Double Click ที่ Button Object เพื่อเขียน Code Behide กัน
ลอง โชว์ Message Box

private async void button_Click(object sender, RoutedEventArgs e)
{
var dialog = new MessageDialog(“Hey Windows Universal Platform app!”);
await dialog.ShowAsync();
}

9. Compile App ได้เลยแล้วลอง Click ที่ปุ่ม Button

App เราก็จะถูก Style ด้วย Windows 10 – WUP UI เป็นค่าเริ่มต้น

msgbox_run

10. ถ้าอยากลองเทสกับหน้าจอหลายๆแบบ ใน Visual Studio ก็มีให้ปรับตามนี้

screen_res.png

11. ลองมาดู output files ของการ compile กันครับ ผลออกมาคือ .exe และ พวก dependencies assemblies ทั้งหลาย

app_output

12. ลอง double click เพื่อรัน App2.exe ตรงๆกันดูครับ

อ้าว error! แล้วเราจะรัน app ของเรายังไงล่ะครับ….

runtime_err.png

13. ลองไป เมนู Deploy App ดู

deploy.png

14. หลังจาก Deploy เสร็จ App ของเราก็มาโผล่ที่ Start Menu นั่นเอง

startmenu

และเนื่องจากผมลองเขียน app ที่มี scope ชัดเจนนิดนึง เลยลองเขียน App อ่านเวปสุดฮิต
แน่นอน Pantip นั่นเอง 🙂

ซึ่งตอนนี้ทาง app ก็ยังไม่มีอะไรมาก แค่ ListView ที่ทำ Data Binding กับ List Object เอามา render บนหน้าจอได้รวมถึงได้ลองใช้ HTTP req ในการดึง Data จาก Pantip.

pnatipw

ท้ายที่สุดจากการทดลองของผม UWP app นั้นเริ่มต้นได้ไม่ยากสำหรับคนที่มีความคุ้นเคยกับ C# และ WPF ซึ่งผมคิดว่าคนที่เคยเขียน Windows Form ก็น่าจะปรับตัวได้ไม่ยาก รวมถึง Visual Studio ที่เป็น IDE ที่ค่อนข้าง Powerful จึงทำให้การเขียนโปรแกรมทำได้เร็วขึ้น

 

ทดสอบ C# ด้วย .NET Core บน OSX

สำหรับคนที่เขียน C# บน Windows ก็คงต้องอยากที่จะให้มันเขียนได้บน Mac หรือ Linux ใช่มั้ยครับ จริงๆแล้วก็มี Mono Framework ที่ตอบโจทย์อยู่แล้ว แต่ถ้าเราต้องการ Native Experience ล่ะ?

.NET Core อาจจะเป็นคำตอบ (มั้ง)

เนื่องจากผมอยากลองดูว่า .NET Core ที่เป็น Open Source ของ .NET Framework ที่ทาง Microsoft ประกาศไว้ช่วงต้นๆปีที่แล้วจะเป็นยังไง ผมก็เลยลอง Setup ดูบน Mac เพื่อทดสอบ

เริ่มต้นจากทำตาม link นี้ http://dotnet.github.io/getting-started/ ซึ่งทางเวปจะ detect ให้ว่าตอนนี้เรากำลังใช้ OS อะไรอยู่

สำหรับ Mac – OSX จะต้องโหลดไฟล์ .pkg เพื่อทำการลง dotnet compiler ลงบนเครื่อง

หลังจากลงเสร็จก็มาเริ่มต้นจากใช้ Termial

Screen Shot 2559-01-10 at 11.48.19 PM

ลองสร้าง new default project ผ่าน commandline “dotnet new”

Screen Shot 2559-01-10 at 11.49.50 PM

ลอง “ls” ดูไฟล์ที่สร้างขึ้นมาจะได้แบบนี้ ซึ่งประกอบด้วย

  1. NuGet.Config
  2. Program.cs
  3. project.json

Screen Shot 2559-01-10 at 11.51.06 PM.png

ลองรัน command ตามที่ Getting Started บอกถัดไป “dotnet restore” เพื่อทำการ restore หรือ download พวก assemblies/dlls/modules ที่ได้กำหนดใน project.json มาเพื่อใช้ในการ Compile ตัวโปรเจคของเรา

Screen Shot 2559-01-10 at 11.54.08 PM

หลังจาก restore พวก dependencies ของโปรเจคเราแล้วลองสั่ง  compile และ run กันด้วย “dotnet run”

!!!! Error…

Unhandled Exception: System.IO.FileNotFoundException: Could not load file or assembly ‘System.Console, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a’ or one of its dependencies. The system cannot find the file specified.

Screen Shot 2559-01-10 at 11.56.20 PM

ปัญหานี้ก็คือมาดูที่ไฟล์ Program.cs

Code โปรแกรมเรามีการเรียกใช้ Console.WritLine หมายความว่ามันมี Dependency กับ System.Console ทำให้ Compile ไม่ผ่าน

using System;

namespace ConsoleApplication
{
 public class Program
 {
 public static void Main(string[] args)
 {
 Console.WriteLine("Hello World!");
 }
 }
}

ทีนี้มาดูไฟล์ project.json

{
 "version": "1.0.0-*",
 "compilationOptions": {
 "emitEntryPoint": true
 },
"dependencies": {
 "NETStandard.Library": "1.0.0-rc2-23616"
 },
"frameworks": {
 "dnxcore50": { }
 }
}

เราต้องทำการเพิ่ม dependencies เพื่อให้โปรเจคนี้รู้จัก dlls อื่นมากขึ้นเช่น System.Console ดังนั้นแก้ไฟล์ประมาณนี้

{
 "version": "1.0.0-*",
 "compilationOptions": {
 "emitEntryPoint": true
 },
"frameworks": {
 "dnxcore50": { 
"dependencies": { 
 "System.Console": "4.0.0-beta-*", 
 "System.IO": "4.0.11-beta-*", 
 "System.Runtime": "4.0.21-beta-*" 
 }
 }
 }
}

ลองรัน “dotnet restore” อีกรอบเพื่อโหลด dlls มาใหม่ก็จะยัง Error!!! ถ้าใช้ OSX 10.11.2+

ที่นี้ลองมาใช้ command นี้แทนในการ restore

“dotnet restore –runtime osx.10.10-x64”

จากนั้นก็ลอง “dotnet run” ในที่สุด Hello World! ก็ออกมาแล้ว

Screen Shot 2559-01-11 at 12.29.49 AM

ลองเขียน C# บน mac ด้วย Mono

วันนี้ว่างๆครับ เลยลองทดสอบการเขียนโปรแกรมด้วย C# บน mac
เนื่องจากว่า C# นั้นพัฒนาจาก Microsoft ซึ่งแรกเริ่มเดิมทีนั้นทำมาเพื่อ Windows

โดยทางสถาปัตยกรรมแล้วโปรแกรมหรือแอฟที่พัฒนาด้วยภาษา C# นั้นต้องทำงานภายใต้ .NET framework

ซึ่งได้มี project ที่ชื่อว่า Mono พัฒนา .NET framework สำหรับ OS อื่นๆที่ไม่ใช่ Windows และเราจะใช้สิ่งนี้ในการรันโปรแกรม C# บน Mac ครับ

เริ่มต้นจาก download  Mono จาก http://www.mono-project.com/download/ ก่อนซึ่งตัวนี้จะเป็นโปรแกรมที่เอาไว้รัน .exe ที่ compile จาก C#

จากนั้นก็ไป download http://www.monodevelop.com ซึ่งเป็นเครื่องมือ (IDE) ที่ทำให้เราพัฒนาโปรแกรม C# ได้ง่ายขึ้น เช่น UI Design, Debugging และ อื่นๆ ซึ่งจริงๆแล้ว IDE ตัวนี้คือ Xamarin Studio นั่นเอง

จากนั้นผมก็ลองเขียนโปรแกรมง่ายๆ คือการ แสดง message box หลังจาก click ที่ปุ่มที่สร้างขึ้นมาเพื่อที่ว่าผมจะได้ทำความเข้าใจกับ IDE  ตัวนี้

1. Code ในส่วนของการสร้าง window เปล่าๆไม่มีอะไรมาก

Screen Shot 2558-12-13 at 12.29.59 PM

2. มาหน้า Designer ซึ่งทาง Xamarin Studio ก็มี ToolBox Panel ที่ทำให้เราเลือก Control มาวางที่ Window ได้เลยเหมือนที่ทำได้ใน Microsoft Visual Studio

Screen Shot 2558-12-13 at 12.47.20 PM

3. ทำการ handle event เวลาที่มีการ Click ปุ่ม แล้วแสดง Message Box

Screen Shot 2558-12-13 at 12.30.22 PM

4. ลองรันโปรแกรมดู ok เราได้ MessageBox กับข้อความที่ต้องการScreen Shot 2558-12-13 at 12.30.42 PM

เป็นการจบการ install และการทำ simple app อย่างง่ายดาย 🙂