Learn Salesforce-lightning - 10 Code Examples & CST Typing Practice Test

Salesforce Lightning is a component-based framework and user interface platform designed for rapid development of dynamic web applications on the Salesforce ecosystem, providing tools for both developers and admins to create modern enterprise apps.

View all 10 Salesforce-lightning code examples →

Simple Counter App Simple To-Do List Simple Notes App Simple Login Screen Simple Sign-Up Form Simple Profile Page Simple Shopping List Simple Event RSVP App Simple Task Progress Tracker Simple Image Gallery

Learn SALESFORCE-LIGHTNING with Real Code Examples

Updated Nov 26, 2025

Introduction & Fundamentals Setup & Configuration Architecture & Deep Internals Performance & Security Development Workflow Learning & Career Growth Business & Strategy Examples

Code Sample Descriptions

Simple Counter App

# salesforce_lightning/demo/CounterApp
1. Create a Lightning Web Component 'counterApp'
2. Add a variable 'counter' initialized to 0 in JS controller
3. Add a Button element in HTML template
4. Add a Text element to display 'counter'
5. Configure Button click handler -> Increment 'counter'
6. Bind Text element to show current 'counter' value
7. Deploy and preview

A basic Salesforce Lightning example that increments a counter using LWC.

Let’s Try →

Simple To-Do List

# salesforce_lightning/demo/ToDoApp
1. Create LWC 'todoApp'
2. Use Salesforce Object 'Task' with fields 'Title' and 'Completed'
3. Display list of Tasks in HTML template
4. Add Text Input to enter new Task
5. Add Button -> On Click: Create Task record
6. Add Checkbox -> Update 'Completed' status
7. Preview adding and completing tasks

Create a simple To-Do list app using LWC and Salesforce records.

Let’s Try →

Simple Notes App

# salesforce_lightning/demo/NotesApp
1. Create LWC 'notesApp'
2. Use Salesforce Object 'Note' with fields 'Title' and 'Content'
3. Display list of Notes in template
4. Add Button -> Action: Create Note
5. Add Edit functionality -> Update Note
6. Add Delete Button -> Delete Note
7. Preview note management

Create, edit, and delete notes using Salesforce records and LWC.

Let’s Try →

Simple Login Screen

# salesforce_lightning/demo/LoginScreen
1. Create LWC 'loginScreen'
2. Add Text Inputs for Email and Password
3. Add Login Button -> Action: Validate User
4. Show error messages
5. Redirect on successful login
6. Preview login flow

Let’s Try →

Simple Sign-Up Form

# salesforce_lightning/demo/SignUpForm
1. Create LWC 'signUpForm'
2. Add Text Inputs for Email, Password, Name
3. Add Button -> Action: Create User
4. Show success message
5. Redirect to Home Page
6. Preview sign-up

Create new users with LWC and Salesforce Users object.

Let’s Try →

Simple Profile Page

# salesforce_lightning/demo/ProfilePage
1. Create LWC 'profilePage'
2. Display current user fields (Name, Email, Avatar)
3. Add Edit Button -> Update fields
4. Preview profile page

Display and edit user profile using LWC.

Let’s Try →

Simple Shopping List

# salesforce_lightning/demo/ShoppingList
1. Create LWC 'shoppingList'
2. Use Object 'Items' with fields 'Name', 'Quantity'
3. Display list of Items
4. Add Button -> Create Item
5. Add Input -> Update Quantity
6. Add Delete Button -> Delete Item
7. Preview shopping list

Create a shopping list with Salesforce objects and LWC.

Let’s Try →

Simple Event RSVP App

# salesforce_lightning/demo/EventRSVP
1. Create LWC 'eventRSVP'
2. Use Object 'Event' with fields 'Title', 'Date', 'Attendees'
3. Display list of Events
4. Add Button -> Action: Add current user to Attendees
5. Display number of Attendees
6. Preview RSVP interactions

Allow users to RSVP to events with LWC and Salesforce records.

Let’s Try →

Simple Task Progress Tracker

# salesforce_lightning/demo/TaskTracker
1. Create LWC 'taskTracker'
2. Use Object 'Tasks' with fields 'Title', 'Status'
3. Display list of Tasks
4. Add Dropdown -> Update 'Status'
5. Display progress text
6. Preview task updates

Track task progress using status field in Salesforce records and LWC.

Let’s Try →

Simple Image Gallery

# salesforce_lightning/demo/ImageGallery
1. Create LWC 'imageGallery'
2. Use Object 'Images' with fields 'Title', 'Image'
3. Display list in Grid layout
4. Bind Image component to field 'Image'
5. Preview gallery

Display images in a gallery using LWC and Salesforce records.

Let’s Try →

Frequently Asked Questions about Salesforce-lightning

What is Salesforce-lightning?

What are the primary use cases for Salesforce-lightning?

Custom Salesforce apps and dashboards. Sales and service automation. Customer and partner portals. Workflow and approval automation. Integration with third-party services via APIs

What are the strengths of Salesforce-lightning?

Rapid enterprise app development. Strong Salesforce ecosystem integration. Reusable components for efficiency. Mobile-first design and responsive UI. Declarative and programmatic options available

What are the limitations of Salesforce-lightning?

Tied to Salesforce platform (vendor lock-in). Steep learning curve for complex components. Limited offline functionality. Customization can be expensive for small teams. Some limitations in Lightning Web Component styling flexibility

How can I practice Salesforce-lightning typing speed?

CodeSpeedTest offers 10+ real Salesforce-lightning code examples for typing practice. You can measure your WPM, track accuracy, and improve your coding speed with guided exercises.

Learn Other Programming Languages

C React Python C++Rust TypeScript Kotlin PHP Java C#Ruby Mql Cql N1ql Cypher Gremlin Partiql Haskell Elixir Fsharp View all languages →

Learn Salesforce-lightning - 10 Code Examples & CST Typing Practice Test

Code Sample Descriptions

Simple Counter App

# salesforce_lightning/demo/CounterApp
1. Create a Lightning Web Component 'counterApp'
2. Add a variable 'counter' initialized to 0 in JS controller
3. Add a Button element in HTML template
4. Add a Text element to display 'counter'
5. Configure Button click handler -> Increment 'counter'
6. Bind Text element to show current 'counter' value
7. Deploy and preview

A basic Salesforce Lightning example that increments a counter using LWC.

Let’s Try →

Simple To-Do List

# salesforce_lightning/demo/ToDoApp
1. Create LWC 'todoApp'
2. Use Salesforce Object 'Task' with fields 'Title' and 'Completed'
3. Display list of Tasks in HTML template
4. Add Text Input to enter new Task
5. Add Button -> On Click: Create Task record
6. Add Checkbox -> Update 'Completed' status
7. Preview adding and completing tasks

Create a simple To-Do list app using LWC and Salesforce records.

Let’s Try →

Simple Notes App

# salesforce_lightning/demo/NotesApp
1. Create LWC 'notesApp'
2. Use Salesforce Object 'Note' with fields 'Title' and 'Content'
3. Display list of Notes in template
4. Add Button -> Action: Create Note
5. Add Edit functionality -> Update Note
6. Add Delete Button -> Delete Note
7. Preview note management

Create, edit, and delete notes using Salesforce records and LWC.

Let’s Try →

Simple Login Screen

# salesforce_lightning/demo/LoginScreen
1. Create LWC 'loginScreen'
2. Add Text Inputs for Email and Password
3. Add Login Button -> Action: Validate User
4. Show error messages
5. Redirect on successful login
6. Preview login flow

Let’s Try →

Simple Sign-Up Form

# salesforce_lightning/demo/SignUpForm
1. Create LWC 'signUpForm'
2. Add Text Inputs for Email, Password, Name
3. Add Button -> Action: Create User
4. Show success message
5. Redirect to Home Page
6. Preview sign-up

Create new users with LWC and Salesforce Users object.

Let’s Try →

Simple Profile Page

# salesforce_lightning/demo/ProfilePage
1. Create LWC 'profilePage'
2. Display current user fields (Name, Email, Avatar)
3. Add Edit Button -> Update fields
4. Preview profile page

Display and edit user profile using LWC.

Let’s Try →

Simple Shopping List

# salesforce_lightning/demo/ShoppingList
1. Create LWC 'shoppingList'
2. Use Object 'Items' with fields 'Name', 'Quantity'
3. Display list of Items
4. Add Button -> Create Item
5. Add Input -> Update Quantity
6. Add Delete Button -> Delete Item
7. Preview shopping list

Create a shopping list with Salesforce objects and LWC.

Let’s Try →

Simple Event RSVP App

# salesforce_lightning/demo/EventRSVP
1. Create LWC 'eventRSVP'
2. Use Object 'Event' with fields 'Title', 'Date', 'Attendees'
3. Display list of Events
4. Add Button -> Action: Add current user to Attendees
5. Display number of Attendees
6. Preview RSVP interactions

Allow users to RSVP to events with LWC and Salesforce records.

Let’s Try →

Simple Task Progress Tracker

# salesforce_lightning/demo/TaskTracker
1. Create LWC 'taskTracker'
2. Use Object 'Tasks' with fields 'Title', 'Status'
3. Display list of Tasks
4. Add Dropdown -> Update 'Status'
5. Display progress text
6. Preview task updates

Track task progress using status field in Salesforce records and LWC.

Let’s Try →

Simple Image Gallery

# salesforce_lightning/demo/ImageGallery
1. Create LWC 'imageGallery'
2. Use Object 'Images' with fields 'Title', 'Image'
3. Display list in Grid layout
4. Bind Image component to field 'Image'
5. Preview gallery

Display images in a gallery using LWC and Salesforce records.

Let’s Try →

Frequently Asked Questions about Salesforce-lightning

What is Salesforce-lightning?

What are the primary use cases for Salesforce-lightning?

Custom Salesforce apps and dashboards. Sales and service automation. Customer and partner portals. Workflow and approval automation. Integration with third-party services via APIs

What are the strengths of Salesforce-lightning?

Rapid enterprise app development. Strong Salesforce ecosystem integration. Reusable components for efficiency. Mobile-first design and responsive UI. Declarative and programmatic options available

What are the limitations of Salesforce-lightning?

How can I practice Salesforce-lightning typing speed?

CodeSpeedTest offers 10+ real Salesforce-lightning code examples for typing practice. You can measure your WPM, track accuracy, and improve your coding speed with guided exercises.