js assignments

Brest มันฉลาม

การกำหนด JavaScript

อย่าลืมส่งผลลัพธ์ของคุณ! ส่งผลลัพธ์

เอกสาร

• วิธีการซิงค์ส้อมของคุณจาก repo ดั้งเดิมเพื่อให้ทันกับการเปลี่ยนแปลงของพวกเขา
• ส่งโซลูชันของคุณให้เราเพื่อตรวจสอบ

ยังมีการมอบหมาย JavaScript อีกครั้ง มีแหล่งข้อมูล JavaScript แบบโต้ตอบมากมายสำหรับผู้เริ่มต้น แต่ส่วนใหญ่เป็นออนไลน์และไม่ครอบคลุมเวิร์กโฟลว์การเขียนโปรแกรมที่ทันสมัย มีแหล่งข้อมูลการฝึกอบรมที่ยอดเยี่ยมเกี่ยวกับ GitHub (https://github.com/rmurphey/js-assessment, https://github.com/mrdavidlaing/javascript-koans, https://github.com/vasanthk/js-bits) ดังนั้นแรงจูงใจของโครงการนี้คือการแสดงกระบวนการ TDD ในป่าสู่ผู้เริ่มต้น การทดสอบการประเมินจะถูกนำไปใช้ในรูปแบบต่าง ๆ เพื่อให้รู้สึกถึงความแตกต่างและได้รับประสบการณ์ในลักษณะที่ดีสิ่งที่ไม่ดีและสิ่งที่น่าเกลียด

อีกแนวคิดหนึ่งคือการเตรียมการมอบหมายให้ครอบคลุมฟังก์ชั่น JavaScript มาตรฐานทั้งหมดเพื่อการขุดเจาะและทักษะการเรียนรู้ งานบางอย่างใช้งานได้จริง แต่งานบางอย่างค่อนข้างสังเคราะห์

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

หากต้องการเริ่มการกำหนด JavaScript โปรดทำตามขั้นตอนถัดไป:

• ส้อม repo นี้
• ตั้งค่า travis-ci เพื่อทดสอบการกระทำ
• ตั้งค่าสภาพแวดล้อมการทำงาน
• ใช้งานที่ได้รับมอบหมายโดยใช้แฟชั่น TDD
• วิธีการดีบักงาน

วิธีแยก repo นี้

• คลิกปุ่ม ส้อม ที่มุมบนขวาของหน้านี้และที่เก็บจะถูกคัดลอกไปยังบัญชีของคุณเอง
• เรียกใช้ git clone https://github.com/<your-account>/js-assignments.git จากบรรทัดคำสั่งเพื่อดาวน์โหลด repo

วิธีการตั้งค่า travis-ci

• เปิด https: // travis-ci/และลงชื่อเข้าใช้กับบัญชี GitHub ของคุณ
• เปิดใช้งาน repo js-signments ของคุณ
• แก้ไขไฟล์ Local Readme.md และอัปเดตลิงก์ทั้งหมด (เพียงแทนที่เหตุการณ์ทั้งหมดของ 'it-shark-pro' ด้วยชื่อบัญชีของคุณ)
• กระทำและผลักดัน readme.md ที่อัปเดตไปยัง GitHub:

  git add README.md
  git commit -m " Update the links "
  git push origin master

• เปิด https://github.com/it-shark-pro/js-assignments และทดสอบไอคอนสร้าง ตอนนี้มันจะเรียกใช้การทดสอบและสถานะการอัปเดตทั้งหมดเมื่อคุณส่งการเปลี่ยนแปลงไปยัง GitHub เก็บไอคอนสีเขียวไว้!

วิธีการตั้งค่าสภาพแวดล้อมการทำงาน

• ดาวน์โหลดและติดตั้ง nodejs ล่าสุด
• เรียกใช้โฟลเดอร์ npm install จากคุณเพื่อดาวน์โหลดโมดูลที่ต้องการ โมดูลที่ขึ้นอยู่กับทั้งหมดจะอยู่ในโฟลเดอร์ Node_Modules
• เปิดตัวแก้ไขที่คุณชื่นชอบและงานที่สมบูรณ์
• เปิดเทอร์มินัลของคุณและใช้คำสั่ง npm test เพื่อเรียกใช้การทดสอบทั้งหมด คุณสามารถเรียกใช้ไฟล์เดียวโดยส่งผ่านเป็นอาร์กิวเมนต์ npm test ./test/01-strings-tests.js
• โฟลเดอร์ repo ท้องถิ่นมีโครงสร้างดังต่อไปนี้:

  node_modules - app dependences restored by npm install command, you can delete this folder and restore later again.
  task - folder with tasks modules, it's your main folder.
  test - folder with tests modules to verify the tasks completion.

วิธีการใช้งานที่ได้รับมอบหมายโดยใช้แฟชั่น TDD

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

  /**
   * Returns the result of concatenation of two strings.
   *
   * @param {string} value1
   * @param {string} value2
   * @return {string}
   *
   * @example
   *   'aa', 'bb' => 'aabb'
   *   'aa',''    => 'aa'
   *   '',  'bb'  => 'bb'
   */
  function concatenateStrings ( value1 , value2 ) {
     throw new Error ( 'Not implemented' ) ;
  }

แก้ไขงานนี้โดยใช้ขั้นตอน TDD ต่อไปนี้:

• เรียกใช้การทดสอบหน่วยและตรวจสอบให้แน่ใจว่าทุกอย่างโอเคและไม่มีการทดสอบที่ล้มเหลว
• อ่านคำอธิบายงานในความคิดเห็นด้านบนฟังก์ชั่น พยายามเข้าใจความคิด หากคุณได้รับมันคุณจะต้องเขียนการทดสอบหน่วยก่อน แต่การทดสอบหน่วยได้เตรียมไว้แล้ว :) ข้ามขั้นตอนด้วยการทดสอบหน่วยการทดสอบ
• ลบบรรทัดข้อผิดพลาดในการขว้างออกจากฟังก์ชั่น

     throw new Error ( 'Not implemented' ) ;

และเรียกใช้การทดสอบหน่วยอีกครั้ง ค้นหาการทดสอบหนึ่งครั้งล้มเหลว (สีแดง) ตอนนี้ถึงเวลาแก้ไขแล้ว!

• ใช้ฟังก์ชั่นด้วยวิธีใด ๆ และตรวจสอบโซลูชันของคุณโดยเรียกใช้การทดสอบจนกว่าการทดสอบที่ล้มเหลวจะถูกส่งผ่าน (สีเขียว)
• โซลูชันของคุณใช้งานได้ แต่ตอนนี้ถึงเวลาที่จะ refactor พยายามทำให้รหัสของคุณสวยและเรียบง่ายที่สุดเท่าที่จะเป็นไปได้ในการทดสอบสีเขียว
• เมื่อคุณไม่สามารถปรับปรุงรหัสและการทดสอบจะผ่านไปแล้วคุณสามารถใช้วิธีแก้ปัญหาได้
• ส่งการอัปเดตของคุณไปยังเซิร์ฟเวอร์ GitHub และตรวจสอบว่าการทดสอบผ่าน Travis-CI หรือไม่
• หากทุกอย่างโอเคคุณสามารถพยายามแก้ไขงานต่อไป

วิธีการดีบักงาน

ในการดีบักการทดสอบคุณสามารถใช้ ผู้ตรวจการโหนด ในการติดตั้งเพียงเรียกใช้ npm install -g node-inspector ในเทอร์มินัลของคุณ จากนั้นทำตามขั้นตอนถัดไป:

• เพิ่ม debugger; ถึงบรรทัดแรกของงานของคุณ
• เรียกใช้ไฟล์ทดสอบของคุณด้วย npm run test-debug ./test/01-strings-tests.js
• ในเทอร์มินัลรัน node-inspector และคัดลอกลิงค์จากเอาต์พุต
• เปิดลิงค์ในเบราว์เซอร์ที่คุณชื่นชอบ คุณควรเห็นเครื่องมือนักพัฒนา Chrome เช่นอินเทอร์เฟซที่คุณสามารถดีบักงานของคุณ
• เมื่อคุณพบและแก้ไขปัญหาของคุณให้ปิดแท็บของเบราว์เซอร์ด้วยเครื่องมือดีบั๊กหยุดการตรวจสอบโหนดโดยกด CTRL-C หยุดการทดสอบนักวิ่งโดยกด CTRL-C ลบ debugger; จากงานของคุณ

วิธีการดีบัก (วิธีการเริ่มต้น)

มีวิธีที่ง่ายกว่าในการดีบักสำหรับผู้เริ่มต้นด้วยรหัส Visual Studio ฟรี:

• ติดตั้ง VSC จาก https://code.visualstudio.com/
• เปิดโฟลเดอร์โครงการใน launch.json และทำตามคำสั่งจาก https://code.visualstudio.com/docs/runtimes/nodejs#_debugging-your-node-application
• แก้ไข launch.json ใน IDE ตั้งค่าคุณสมบัติ "โปรแกรม" และ "args" (ว่างเปล่า "args" เรียกใช้การทดสอบทั้งหมดเพื่อเรียกใช้การทดสอบเฉพาะระบุไฟล์ทดสอบนี้ใน "args"):

 {
    "version": "0.2.0",
    "configurations": [
        {
           ...
           "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
           ...
           "args": ["./test/01-strings-tests.js"],
           ...
         },
         ...
     ]
}

• คลิกในรางน้ำทางด้านซ้ายของหมายเลขบรรทัดเพื่อตั้งค่าเบรกพอยต์ กด F5 เพื่อเรียกใช้การดีบัก
• หมายเหตุ: launch.json ถูกเก็บไว้ในโฟลเดอร์. .vscode Project

ผลงาน

อย่าลังเลที่จะมีส่วนร่วมในโครงการนี้ ยินดีต้อนรับงานใหม่และ katas

eslint

เพื่อแก้ไขการดำเนินการของผ้าสำลี:

 npm run lint -- --fix