String manipulation types (Uppercase, Lowercase) in Typescript - Mini Project: Build & Apply

String manipulation types (Uppercase, Lowercase)

📖 Scenario: You are creating a simple program to help a user format their name correctly. Sometimes names are entered in all uppercase or lowercase letters, but you want to show the name in a consistent style.

🎯 Goal: Build a TypeScript program that takes a name string, converts it to uppercase and lowercase, and then displays both versions.

📋 What You'll Learn

Create a string variable with a specific name value

Create a boolean variable to decide which case to show

Use string methods to convert the name to uppercase or lowercase

Print the converted name based on the boolean variable

💡 Why This Matters

🌍 Real World

Formatting names and text is common in apps like contact lists, forms, and messaging to keep data consistent and readable.

💼 Career

Understanding string manipulation is essential for frontend and backend developers to handle user input, display data properly, and prepare text for storage or communication.

1

Create the initial name string

Create a string variable called userName and set it to the value "Alice".

Typescript

// Your code here

Need a hint?

Use const to create a variable and assign the exact string "Alice".

2

Add a boolean to choose uppercase or lowercase

Create a boolean variable called showUpperCase and set it to true.

Typescript

const userName: string = "Alice";
// Your code here

Need a hint?

Use const to create a boolean variable with the value true.

3

Convert the name based on the boolean

Create a variable called formattedName that uses a conditional expression to set it to userName.toUpperCase() if showUpperCase is true, otherwise userName.toLowerCase().

Typescript

const userName: string = "Alice";
const showUpperCase: boolean = true;
// Your code here

Need a hint?

Use the ternary operator condition ? valueIfTrue : valueIfFalse to choose the case.

4

Print the formatted name

Write a console.log statement to print the value of formattedName.

Typescript

const userName: string = "Alice";
const showUpperCase: boolean = true;
const formattedName: string = showUpperCase ? userName.toUpperCase() : userName.toLowerCase();
// Your code here

Need a hint?

Use console.log(formattedName); to display the result.