Skip to content

Enhance TypeScript Learning Guide with Expanded Descriptions and Reso… #35

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Enhance TypeScript Learning Guide with Expanded Descriptions and Reso… #35

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
145 changes: 89 additions & 56 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,97 +1,130 @@
# Learn TypeScript 5.0+ in Baby Steps
# 🚀 Learn TypeScript 5.0+ in Baby Steps

### [Start from this presentation](https://docs.google.com/presentation/d/1-7Kb3laJjJ68mOTF9v0fHImk5vTol0CeE43Sg8hoUXQ/edit?usp=sharing)
TypeScript is a statically typed superset of JavaScript that enhances development with type safety and modern features. This guide will walk you through TypeScript 5.0+ using a structured approach, incorporating official documentation, tutorials, and hands-on projects.

### [Watch Learn TypeScript – Full Video Tutorial by freeCodeCamp.org](https://www.youtube.com/watch?v=30LWjhZzg50)
---

We will learn TypeScript by taking small incremental steps.
## 📘 Starting Point: Official Resources

Chapters 1-11 of [Learning TypeScript: Enhance Your Web Development Skills Using Type-Safe JavaScript](https://www.amazon.com/Learning-TypeScript-Development-Type-Safe-JavaScript/dp/1098110331/ref=sr_1_1)
### 📄 TypeScript 5.0 Documentation
The official TypeScript Handbook provides comprehensive coverage of all features introduced in TypeScript 5.0, including decorators, const type parameters, and performance optimizations.
- **Link:** [TypeScript 5.0 Release Notes](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-5-0.html)

[In Class Companion projects and articles for Learning TypeScript](https://www.learningtypescript.com/)
### 🎓 TypeScript for the New Programmer
Ideal for beginners, this guide introduces TypeScript concepts from scratch, making it accessible even if you're new to programming.
- **Link:** [TypeScript From Scratch](https://www.typescriptlang.org/docs/handbook/typescript-from-scratch.html)

---

[Learning TypeScript Project Code in Class](https://github.com/LearningTypeScript/projects)
## 🎥 Video Tutorials

[TypeScript Cookbook: Future Advanced TypeScript Book](https://www.oreilly.com/library/view/typescript-cookbook/9781098136642/)
### 🧑‍🏫 TypeScript 5 Tutorial for Beginners 2023
A step-by-step tutorial designed for beginners, covering TypeScript 5 features with practical examples.
- **Link:** [YouTube Video](https://www.youtube.com/watch?v=2kBjtkrjeDM)

### 📘 TypeScript 5.0 Full Course
An all-in-one tutorial that delves deep into TypeScript 5.0, suitable for those who prefer a comprehensive learning experience.
- **Link:** [YouTube Full Course](https://www.youtube.com/watch?pp=0gcJCfwAo7VqN5tD&v=gieEQFIfgYc)

---

Note:
## 🔧 Key Features in TypeScript 5.0

[TypeScript and C# both were created by the same person named Anders Hejlsberg](https://dev.to/destrodevshow/typescript-and-c-both-created-by-the-same-person-named-anders-hejlsberg-42g4)
| Feature | Description |
|-----------------------------|-----------------------------------------------------------------------------|
| **Modernized Decorators** | Aligns with the ECMAScript proposal for decorators, enhancing metadata reflection and type safety. |
| **Const Type Parameters** | Introduces `const` type parameters, enabling more precise type inference. |
| **Enum Improvements** | Optimizes enum compilation, improving runtime performance and reducing bundle sizes. |
| **Performance Enhancements**| Significant improvements in speed, memory usage, and package size. |

### TypeScript Homework Coding Projects:
For detailed notes:
- [Official Release Notes](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-5-0.html)
- [Kinsta Article on TypeScript 5.0](https://kinsta.com/blog/typescript-5-0/)
- [Dev.to Deep Dive](https://dev.to/info_generalhazedawn_a3d/exploring-the-latest-features-of-typescript-50-a-deep-dive-into-new-improvements-3ck9)

[TypeScript Node.js Projects](https://github.com/panacloud-modern-global-apps/typescript-node-projects)
---

## 🧪 Hands-On Learning

### Learn From Matt Pocock The TypeScript Wizard
### 💻 TypeScript Playground
Experiment with TypeScript code directly in your browser using the official TypeScript Playground.
- **Link:** [TypeScript Playground](https://www.typescriptlang.org/play)

[Latest News: Matt Joins Vercel](https://twitter.com/mattpocockuk/status/1559105611995955202)
### 🧰 TypeScript Projects
Engage in practical projects to solidify your understanding of TypeScript concepts.
- **Link:** [TypeScript Project Examples](https://github.com/LearningTypeScript/projects)

[Total TypeScript Website](https://www.totaltypescript.com/)
- **Node.js TypeScript Projects:** [GitHub Repository](https://github.com/panacloud-modern-global-apps/typescript-node-projects)

[TypeScript Crash Course for Beginners with Matt Pocock: Video](https://www.youtube.com/watch?v=p6dO9u0M7MQ&t=25s)
---

[Learning TypeScript from Scratch with Matt Pocock: A TypeScript tutorial](https://www.youtube.com/watch?v=qcFmCKQDa2s&t=1s)
## 🧙‍♂️ Learn from Experts

[Beginner TypeScript Tutorial](https://github.com/total-typescript/beginners-typescript-tutorial)
### Matt Pocock – TypeScript Wizard
Matt Pocock offers a series of tutorials and resources to deepen your TypeScript knowledge.

[Zod Tutorial: Video](https://www.totaltypescript.com/tutorials/zod)
- **Website:** [Total TypeScript](https://www.totaltypescript.com/)
- **Crash Course for Beginners (Video):** [YouTube](https://www.youtube.com/watch?v=p6dO9u0M7MQ&t=25s)
- **Learning TypeScript from Scratch (Video):** [YouTube](https://www.youtube.com/watch?v=qcFmCKQDa2s&t=1s)
- **Beginner TypeScript Tutorial (GitHub):** [GitHub](https://github.com/total-typescript/beginners-typescript-tutorial)
- **Advanced TypeScript Workshop:** [GitHub](https://github.com/total-typescript/advanced-typescript-workshop)
- **Zod Tutorial & Docs:** [Video](https://www.totaltypescript.com/tutorials/zod) | [Docs](https://zod.dev/)
- **Tips & Tricks:** [Website](https://www.totaltypescript.com/tips) | [Video](https://www.youtube.com/watch?v=hBk4nV7q6-w&t=24s)

[Zod Docs](https://zod.dev/)
---

[Advanced TypeScript Workshop](https://github.com/total-typescript/advanced-typescript-workshop)
## 📝 TypeScript Proficiency Quiz

[Advanced TypeScript with Matt: Video](https://www.youtube.com/watch?v=F7O4gA0GXqI&t=389s)
### 📅 Quiz Details
- **Name:** TypeScript Proficiency Quiz
- **Date & Time:** Sunday, Oct 23, 9:00 PM
- **Total MCQs:** 63
- **Duration:** 120 minutes
- **Platform:** [PIAIC Portal](https://portal.piaic.org/)

[TypeScript Tips](https://www.totaltypescript.com/tips)
### 🛠️ Preparation Instructions
1. Install **Safe Exam Browser (SEB)** from PIAIC portal.
2. Download the configuration file from the portal.
3. Open the config file with SEB.
4. Log in using your portal credentials.
5. Enter the security key provided in the exam section.
6. Complete the quiz with a stable internet connection.
> **Note:** The quiz can only be attempted on Windows or Mac laptops/desktops. No rescheduling allowed.

[TypeScript tips and Tricks with Matt: Video](https://www.youtube.com/watch?v=hBk4nV7q6-w&t=24s)
- **SEB Installation Guide (Video):** [YouTube](https://youtu.be/MhYvz-50y0Y)
![Download SafeExam Browser](safe_exam.jpeg)

### TypeScript Proficiency Quiz Details and Instructions
---

All Web 3 and Metaverse Students who are already software developers will appear in the following Quiz remotely from home:
## 🌐 Explore More

Name: TypeScript Proficiency Quiz
### Articles & Documentation
- **TypeScript 5.0 Features & Improvements:** [Kinsta](https://kinsta.com/blog/typescript-5-0/)
- **TypeScript 5.0: New Features and Issues Solved:** [Medium](https://medium.com/rewrite-tech/typescript-5-0-the-new-features-and-the-issues-they-solve-49757530e760)

Date and Time: Sunday, Oct 23, 9:00 pm
### Frameworks & Backend Development
- **Next.js + TypeScript Projects:** [GitHub](https://github.com/panacloud-modern-global-apps/nextjs)
- **Node.js/Express + TypeScript Projects:** [GitHub](https://github.com/panacloud/learn-typed-express)

URL: https://portal.piaic.org/
![TypeScript Cheatsheet](typescript.jpeg)

Total MCQs: 63

Total Time: 120 minutes
---

Please complete your installation, etc. ASAP i.e. before the exam.
## 🎯 Final Thoughts & Motivation

It is important to note the following:
1. You will attempt your exam at your home using the Safe Exam Browser.
2. Download & Install Safe Exam Browser from Portal.
3. After Installing the safe browser, download the Config file from the PIAIC Portal.
4. Right click on the config file and select “open with” then select SEB.
5. After running the Config file, log in with PIAIC Portal Credentials
6. Select your Quiz and enter the security key (which will be available on the portal in the exam section) & start the test.
7. Make sure you have a stable internet connection before attempting the quiz.
8. Once you have completed the quiz simply logout and close the browser, your quiz will be submitted.
9. The Quiz can only be attempted on a Laptop or a Desktop computer running Windows or Mac only.
10. If you miss the quiz date there will be strictly no re-scheduling
11. Security key for the quiz will be available on Portal in exam section
12. It is essential to note that QUIZZES WILL NOT BE RESCHEDULED FOR ANY REASON REGARDLESS OF THE CIRCUMSTANCES.
Congratulations on reaching this stage of your TypeScript journey! 🎉

Safe Exam Browser installation and configuration Guide is available here.:
Learning TypeScript is not just about writing code—it’s about thinking in a type-safe, structured way that makes your projects more robust, maintainable, and future-proof. As you continue:

https://youtu.be/MhYvz-50y0Y
- 💡 **Practice Regularly:** The more projects you build, the stronger your understanding becomes.
- 🛠 **Experiment:** Don’t be afraid to try new patterns, libraries, and frameworks with TypeScript.
- 📚 **Stay Updated:** TypeScript evolves rapidly; follow official release notes, tutorials, and expert blogs.
- 🤝 **Collaborate:** Join communities, discuss ideas, and share your projects to learn faster.
- 🚀 **Think Beyond:** Once comfortable, explore Next.js, Node.js/Express, or even Web3 projects with TypeScript.

![Download Safeexam Browser](safe_exam.jpeg)
Remember: every expert was once a beginner. Take one step at a time, enjoy the learning process, and celebrate your progress along the way. 🌟

Note: Those who are beginners in programming should not appear in this quiz now, but will appear in the quiz at the end of the quarter.
> “TypeScript is more than a language—it’s a mindset that empowers you to write safer, cleaner, and smarter code.”

![TypeScript Cheetsheet](typescript.jpeg)

### Learn Next.js and Node.js/Express

[You can also learn Next.js using TypeScript from here](https://github.com/panacloud-modern-global-apps/nextjs)

[You can also learn Node.js/Express using TypeScript from here](https://github.com/panacloud/learn-typed-express)
Happy coding, and may your journey with TypeScript unlock endless possibilities! 💻✨