Setup for Lightning Web Component

Salesforce spring’19 release has brought many exciting features and one of them is lightning web component. It is a new programming model for building Lightning components. This development introduces new tooling standards and conventions into the world of Salesforce development.

Set Up Your Development Environment

To develop Lightning web components, use your favorite code editor. You can’t develop Lightning web components in the Developer Console. To move source code to and from a Salesforce org, use the Salesforce CLI and Visual Studio Code (recommended editor).

For building lightning web component you need

• Install the Salesforce CLI

• Upgrade to the pre-release version

• Install Visual Studio Code

• Install Salesforce Extension Pack

• Install Lightning Web Component Extension

What is Salesforce DX?

The Salesforce Developer Experience (DX) is a set of tools that streamlines the entire development life cycle. It improves team development and collaboration, facilitates automated testing and continuous integration, and makes the release cycle more efficient and agile.

Install SFDX CLI

It is a powerful command line interface Used to create environments for development and testing.

Use the below URL to install Salesforce CLI https://developer.salesforce.com/tools/sfdxcli

Download visual studio code

Visual Studio Code combines the simplicity of a source code editor with powerful developer tooling, like IntelliSense code completion and debugging.

Use below URL to install Visual Studio Code

https://code.visualstudio.com/

Register for pre-release

As Lightning Web Component is still in pre- release state so use below URL to fill pre-release form.

https://www.salesforce.com/form/signup/prerelease-spring19/

Check sfdx version in command prompt

Run: sfdx version

Upgrade CLI with force.com prerelease org.

Run: sfdx plugins:install salesforcedx@pre-release

Verify plugins

After it runs you can verify the installation by typing sfdx plugin and making sure the version number is greater than 45.0.9.

Run:sfdx plugins

Install Salesforce Extensions for Visual Studio Code

With VS Code open you can see the different menu tabs on the left hand side

Install Salesforce Extension pack

This extension pack includes tools for developing on the Salesforce platform in the lightweight, extensible VS Code editor

Install Lightning web component

This extension provides code-editing features for the Lightning Web Components programming model, which is part of the Lightning Component framework.

Ensure Your Development Environment Is Ready

1.Press Ctrl+Shift+P. Type sfdx to filter for sfdx commands.

2.Choose SFDX:Create Project and press enter

Conclusion

The introduction of Lightning web components has brought Salesforce developers with bundle of new tools and resources to build amazing applications.

References

https://developer.salesforce.com/docs/component-library/documentation/lwc

https://developer.salesforce.com/blogs/2018/12/developer-tools-for-lightning-web-components.html