TypeScript - dltmdrbtjd/HANG GitHub Wiki

TypeScript

νƒ€μž…μŠ€ν¬λ¦½νŠΈ κ°œμš”

νƒ€μž…μŠ€ν¬λ¦½νŠΈ(TypeScript)λŠ” Microsoftμ—μ„œ κ°œλ°œν•˜κ³  μœ μ§€/κ΄€λ¦¬ν•˜λŠ” Apache λΌμ΄μ„ΌμŠ€κ°€ λΆ€μ—¬λœ μ˜€ν”ˆ μ†ŒμŠ€μž…λ‹ˆλ‹€.

일반 μžλ°”μŠ€ν¬λ¦½νŠΈλ‘œ μ»΄νŒŒμΌλ˜λŠ” μžλ°”μŠ€ν¬λ¦½νŠΈ Superset(μƒμœ„ ν˜Έν™˜)으둜 2012λ…„ 10월에 처음 릴리슀 λ˜μ—ˆμŠ΅λ‹ˆλ‹€.

νƒ€μž…μŠ€ν¬λ¦½νŠΈ μ‚¬μš©μ΄μœ 

νƒ€μž…μŠ€ν¬λ¦½νŠΈ μž₯점

C#κ³Ό Java 같은 체계적이고 μ •μ œλœ μ–Έμ–΄λ“€μ—μ„œ μ‚¬μš©ν•˜λŠ” κ°•ν•œ νƒ€μž… μ‹œμŠ€ν…œμ€ 높은 가독성과 μ½”λ“œ ν’ˆμ§ˆ 등을 μ œκ³΅ν•  수 있고 λŸ°νƒ€μž„μ΄ μ•„λ‹Œ 컴파일 ν™˜κ²½μ—μ„œ μ—λŸ¬κ°€ λ°œμƒν•΄ 치λͺ…적인 였λ₯˜λ“€μ„ λ”μš±λ” μ‰½κ²Œ μž‘μ•„λ‚Ό 수 μžˆμŠ΅λ‹ˆλ‹€.

반면 μžλ°”μŠ€ν¬λ¦½νŠΈλŠ” νƒ€μž… μ‹œμŠ€ν…œμ΄ μ—†λŠ” 동적 ν”„λ‘œκ·Έλž˜λ° μ–Έμ–΄λ‘œ, μžλ°”μŠ€ν¬λ¦½νŠΈ λ³€μˆ˜λŠ” λ¬Έμžμ—΄, 숫자, 뢈린 λ“± μ—¬λŸ¬ νƒ€μž…μ˜ 값을 κ°€μ§ˆ 수 μžˆμŠ΅λ‹ˆλ‹€. 이λ₯Ό μ•½ν•œ νƒ€μž… 언어라고 ν‘œν˜„ν•  수 있으며 비ꡐ적 μœ μ—°ν•˜κ²Œ κ°œλ°œν•  수 μžˆλŠ” ν™˜κ²½μ„ μ œκ³΅ν•˜λŠ” ν•œνŽΈ λŸ°νƒ€μž„ ν™˜κ²½μ—μ„œ μ‰½κ²Œ μ—λŸ¬κ°€ λ°œμƒν•  수 μžˆλŠ” 단점을 κ°€μ§‘λ‹ˆλ‹€.

그리고 νƒ€μž…μŠ€ν¬λ¦½νŠΈλŠ” μ΄λŸ¬ν•œ μžλ°”μŠ€ν¬λ¦½νŠΈμ— κ°•ν•œ νƒ€μž… μ‹œμŠ€ν…œμ„ μ μš©ν•΄ λŒ€λΆ€λΆ„μ˜ μ—λŸ¬λ₯Ό 컴파일 ν™˜κ²½μ—μ„œ μ½”λ“œλ₯Ό μž…λ ₯ν•˜λŠ” λ™μ•ˆ 체크할 수 μžˆμŠ΅λ‹ˆλ‹€.

  • μ‹€μ œλ‘œ jsκ°œλ°œκ³Όμ •μ—μ„œ μ„œλ²„μ™€ 데이터λ₯Ό μ£Όκ³ λ°›μ„λ•Œ μ‹€μ œλ‘œ μž‘λ™ν•˜κ³  λ‚˜μ„œ νƒ€μž…μ—λŸ¬λ“€μ„ λ°œκ²¬ν•˜λŠ” κ²½μš°κ°€ 생각보닀 λΉˆλ²ˆν•˜μ˜€κ³  맀번 μ½”λ“œμž‘μ„±ν›„ μ‹€ν–‰κΉŒμ§€ ν•˜κ³ λ‚˜μ„œ μ—λŸ¬κ°€ λ°œμƒν•˜κ±°λ‚˜ μ–΄λ””μžˆλŠ”μ§€ 쑰차도 μžμ„Ένžˆ μ•ˆμ•Œλ €μ€˜μ„œ λΆˆνŽΈν•¨μ„ 많이 κ²ͺμ—ˆμ—ˆλ‹€. ν•˜μ§€λ§Œ λ¦¬νŒ©ν† λ§ κ³Όμ •ν›„ μ—λŸ¬λ₯Ό μ°ΎκΈ° ꡉμž₯히 쉽고 싀행전에 미리 μ•Œλ €μ£ΌκΈ° λ•Œλ¬Έμ— λ²ˆκ±°λ‘œμ›€λ„ ꡉμž₯히 μ—†μ–΄μ‘Œλ‹€. 그리고 버그방지 λΆ€λΆ„μ—μ„œλ„ ꡉμž₯ν•œ 이득을 λ³΄μ•˜κ³  νŒ€μž‘μ—… νš¨μœ¨μ„±μ΄ 많이 μ¦κ°€ν•˜μ˜€λ‹€.

μ„€μΉ˜

npx create-react-app my-app --template cra-template-pwa-typescript
// pwa와 ν•¨κ»˜ μ‚¬μš©ν•˜κΈ°μœ„ν•΄μ„œ μœ„ λ°©μ‹μœΌλ‘œ μƒμ„±ν•˜μ˜€μŠ΅λ‹ˆλ‹€.

μ˜ˆμ‹œ

  • μ΄λŸ°μ‹μœΌλ‘œ νƒ€μž…μ„ λͺ…μ‹œν•˜μ—¬μ„œ 주고받을 데이터 및 μ‚¬μš©ν•  λ°μ΄ν„°λ“€μ—μ„œ λ°œμƒν•˜λŠ” νƒ€μž…κ΄€λ ¨ 였λ₯˜ 및 버그 등등을 사전에 인지할 수 있고 ν˜‘μ—…ν•˜λŠ” νŒ€μ›λ˜ν•œ μ½”λ“œμ— λŒ€ν•œ 이해λ₯Ό 더 λͺ…ν™•νžˆ ν•  수 μžˆμ—ˆμŠ΅λ‹ˆλ‹€.

자료 : https://heropy.blog/2020/01/27/typescript/ , https://www.typescriptlang.org/