Template literals in Javascript - Mini Project: Build & Apply

Using Template Literals in JavaScript

📖 Scenario: You are creating a small program to greet users with their name and age in a friendly sentence.

🎯 Goal: Build a program that uses template literals to combine variables into a greeting message.

📋 What You'll Learn

Create variables with exact names and values

Use template literals with backticks and ${} syntax

Print the final greeting message exactly as specified

💡 Why This Matters

🌍 Real World

Template literals make it easy to create messages that include changing information, like user names or dates, which is common in websites and apps.

💼 Career

Knowing how to use template literals helps you write cleaner and more readable code when working with strings, a skill useful for web developers and software engineers.

1

Create user data variables

Create a variable called name and set it to the string "Alice". Create another variable called age and set it to the number 30.

Javascript

// Your code here

Need a hint?

Use const to create variables and assign the exact values.

2

Create a greeting message using template literals

Create a variable called greeting and set it to a template literal that says: Hello, my name is ${name} and I am ${age} years old.

Javascript

const name = "Alice";
const age = 30;
// Your code here

Need a hint?

Use backticks ` to create the template literal and insert variables with ${}.

3

Add a condition to change the greeting

Create a variable called isBirthday and set it to true. Then create a variable called finalGreeting that uses a template literal to say Happy Birthday, ${name}! if isBirthday is true, otherwise use the greeting variable.

Javascript

const name = "Alice";
const age = 30;
const greeting = `Hello, my name is ${name} and I am ${age} years old.`;
// Your code here

Need a hint?

Use the ternary operator condition ? valueIfTrue : valueIfFalse inside the template literal assignment.

4

Print the final greeting message

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

Javascript

const name = "Alice";
const age = 30;
const greeting = `Hello, my name is ${name} and I am ${age} years old.`;
const isBirthday = true;
const finalGreeting = isBirthday ? `Happy Birthday, ${name}!` : greeting;
// Your code here

Need a hint?

Use console.log(finalGreeting); to print the message.