รู้จักกับ REPLIT IDE เขียนโค้ดออนไลน์ได้มากกว่า 50 ภาษา

อยากฝึกเขียนโค้ดออนไลน์ ใช้ text editor ของอะไรดี?

REPLIT คือคำตอบ! ของดีแถมฟรี เข้าผ่าน web browser ไม่ต้องติดตั้งโปรแกรมอะไรให้ยุ่งยาก 555+

บทความนี้แอดมาสอนใช้งาน REPLIT เบื้องต้น สร้าง repl เขียนโค้ดและแชร์งานของแบบ public

Table of Contents

What is REPLIT

REPLIT คือ online text editor หรือ IDE (integrated development environment) ให้เราเขียนโค้ดและพัฒนา software เช่น web app ง่ายๆผ่าน browser ได้เลย ง่ายจนงง ยั๊งงง 😝

จุดเด่นของ REPLIT

• ฟรี สร้างโปรเจ็คได้ไม่อั้น (unlimited public REPLs)
• ใช้งานง่าย เหมือน notepad ใน Windows
• cloud based เข้าใช้งานที่ไหน เมื่อไหร่ก็ได้ แค่มี internet
• สามารถอัพเกรดเป็น Hacker plan จะได้ CPU แรงขึ้น รันโค้ดได้ไวขึ้น และสร้าง private repl ได้ด้วย

ถ้าใครยังไม่มี free account กดปุ่ม Sign Up ใช้ google email ได้เลยนะครับ 😁

พอ login เข้ามาแล้ว เราจะเจอหน้า homepage ตามรูปด้านล่าง ใน replit จะมีคอร์สเรียนฟรีให้เราศึกษาเพิ่มเติมด้วย ใครสนใจภาษาไหน ลองค้นหาคอร์สบนเว็บไซต์ได้ เช่น JavaScript 101, Build a simple web app

📑 บน REPLIT เราเรียกโปรเจ็คใหม่ที่สร้างขึ้นมาว่า REPL เป็นคำศัพท์สาย dev ย่อมาจากคำว่า Read, Evaluate, Print, Loop

ให้เราคลิกที่ปุ่ม + Create ที่มุมซ้ายบนใต้รูป profile ของเรา และเลือกภาษาหรือ framework ที่ต้องการใช้งาน เราสามารถตั้งชื่อ REPL ของเราได้ด้วย (เหมือนตั้งชื่อไฟล์ใน Windows, Mac)

⭐ ส่วนตัวแอดใช้ REPLIT มาได้ประมาณ 2 ปี สมัครแบบ Hacker plan $7 USD ต่อเดือน เสียดายมากตอนนั้นแอดได้ early price $5 usd แต่บัตรเครดิตหมดอายุ 555+ plan เก่าเลยถูกยกเลิกเลย มุแง้

Supported Languages

REPLIT รองรับภาษาต่างๆมากกว่า 50 ภาษา อยากฝึกเขียนภาษาไหน ก็มีให้เลือกครบเลย 555+ จริงๆตอนสร้าง repl เราสามารถเลือก framework ได้ด้วย อย่างของ python ก็มีให้เลือกทั้ง django flask pygame เฉียบ!

• Python
• R
• JavaScript
• Java
• Bash
• C#
• SQLite
• และภาษาอื่นๆอีกมากกว่า 50 ภาษา

Create a new REPL

ถ้าเราอัพเกรดเป็น Hacker plan จะสามารถสร้าง REPL ได้สองแบบคือ

• Public
• Private (สำหรับโปรเจ็คส่วนตัว หรือของทีมเรา)

ตอนเรากด + Create จะมี option ให้เรา import repo โปรเจ็คส่วนตัวจาก GitHub ได้ อันนี้ดีมากๆ เผื่อใครอยากทำ portfolio หรือทำ simple app ของตัวเอง บน REPLIT คือสร้างได้ฟรีๆเลย

Start Coding

มาเริ่มเขียนโค้ดกันดีกว่า แอดสร้าง REPLIT ภาษา Python ขึ้นมาตั้งชื่อว่า NewPythonREPL

ลองเขียนโค้ดง่ายๆในไฟล์ main.py เสร็จแล้วกดปุ่ม Run ผลลัพธ์ของโปรแกรมจะแสดงในหน้าต่าง Console เราสามารถย้ายหน้าต่าง console ได้สองแบบคือแบบ side-by-side และ stacked

print("Hello world")

shopping_list = ['egg', 'milk', 'bread']

for item in shopping_list:
    print(f"Don't forget to buy {item}")

print("OKAY!")

หน้าตา REPLIT เหมือนกับ IDE/ Text Editor ทั่วไป ใช้งานง่ายไม่ต่างกับ VS Code

เราสามารถ upload files ต่างๆ เช่น script, .csv, .txt ขึ้น repl ได้ง่ายๆ แค่กดไอคอน Add file ถ้าอยากดาวน์โหลด project เอามารันต่อที่ local env แค่กดที่ปุ่ม 3 Dots คลิก Download as zip

หน้าต่าง Shell ข้างๆ Console เอาไว้เขียนพวก Bash command line สร้าง file, folder ใหม่ได้

มีอะไรที่ REPLIT ทำไม่ได้บ้างเนี่ย 555+

Dark Theme

แล้วเราเปลี่ยนเป็น Dark Theme ได้มั้ยแอด? ได้เลย แค่กดที่ไอคอน ☀ ที่มุมซ้ายล่าง

Dev ถูกใจสิ่งนี้มากๆ 555+ แต่ตอนนี้มีให้เลือกแค่ 2 themes (light, dark) อนาคตแอดว่าเค้าน่าจะเพิ่ม options อื่นๆด้วย เช่น dracula, monokai, vs code เป็นต้น

Sharing Our App

เขียน app เสร็จแล้ว อยากจะแชร์ให้เพื่อนเราดูต่อ สามารถทำได้สองวิธี

• เอาลิ้ง URL ของ REPL ไปแชร์ต่อได้เลยแบบ public
• หรือจะกด Invite เพื่อนของเราเข้ามาช่วย edit, collab กันก็ได้ (ใช้แค่ email)

ข้อดีของ shared REPL คือเพื่อนเราสามารถกด Run เพื่อดูผลของโปรแกรมได้ด้วย ไม่ใช่เห็นแค่ code อย่างเดียว อันนี้เฉียบมาก ⭐ เต็ม 10/10 ไม่หัก 555+

Use cases ของ REPL คือทำได้หลายแบบมากๆ เรียนเขียนโปรแกรม สร้าง simple web app หรือสร้าง portfolio ไว้ใช้สมัครงาน เอา URL ไปใส่ใน resume หรือแชร์ใน LinkedIn ได้ทันที

หวังว่าบทความนี้จะเป็นประโยชน์กับทุกคนนะครับ ใครสร้าง REPL ของตัวเองได้แล้วอย่าลืมแชร์ให้แอดดูด้วยนะครับ Happy Coding!