How to get Salesforce Base URL in Lightning Web Component

To get Salesforce base URL use the window.location object can be used to get the current page address (URL).
The window.location.origin property returns the origin URL of the current page.

baseURL.html:

<template>
    <lightning-card title="Salesforce Base URL in Lighting Web Component">
        <div class="slds-text-heading_medium slds-text-align-center">
            SFDC Base URL : <p></p><lightning-formatted-url value={sfdcBaseURL} ></lightning-formatted-url></p>
        </div>
    </lightning-card>

</template>

baseURL.js:

import { LightningElement } from 'lwc';
export default class BaseURL extends LightningElement {
    sfdcBaseURL;
    renderedCallback() {
        this.sfdcBaseURL = window.location.origin;
    }

}
baseURL.js-meta.xml:

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>48.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__AppPage</target>
        <target>lightning__RecordPage</target>
        <target>lightning__HomePage</target>
    </targets>

</LightningComponentBundle>

Output:

Getting Current Logged in User information in Lightning Web Component(lwc)

userDetails.html:

<template>
    <lightning-card title="Current Logged User Information">
        <template if:true={objUser}>
            <dl class="slds-list_horizontal slds-wrap" style="margin-left: 3%;">
                <dt class="slds-item_label slds-truncate" title="First Name">First Name:</dt>
                <dd class="slds-item_detail slds-truncate"><b>{objUser.FirstName}</b></dd>
                <dt class="slds-item_label slds-truncate" title="Last Name">Last Name:</dt>
                <dd class="slds-item_detail slds-truncate"><b>{objUser.LastName}</b></dd>
                <dt class="slds-item_label slds-truncate" title="Full Name">Name:</dt>
                <dd class="slds-item_detail slds-truncate"><b>{objUser.Name}</b></dd>
                <dt class="slds-item_label slds-truncate" title="Alias">Alias:</dt>
                <dd class="slds-item_detail slds-truncate"><b>{objUser.Alias}</b></dd>
                <dt class="slds-item_label slds-truncate" title="Active">Is Active:</dt>
                <dd class="slds-item_detail slds-truncate"><b>{objUser.IsActive}</b></dd>
            </dl>
        </template>
    </lightning-card>

</template>

userDetails.js:

import { LightningElement, track, wire} from 'lwc';

// To get the record details based on record id
import { getRecord } from 'lightning/uiRecordApi';

// impoting USER id
import USER_ID from '@salesforce/user/Id'; 

export default class CurrentUserDetailsInLWC extends LightningElement {

    @track objUser = {};
    
    // using wire service getting current user data
    @wire(getRecord, { recordId: USER_ID, fields: ['User.FirstName', 'User.LastName', 'User.Name', 'User.Alias', 'User.IsActive'] })
    userData({error, data}) {
        if(data) {
            window.console.log('data ====> '+JSON.stringify(data));

            let objCurrentData = data.fields;

            this.objUser = {
                FirstName : objCurrentData.FirstName.value,
                LastName : objCurrentData.LastName.value,
                Name : objCurrentData.Name.value,
                Alias : objCurrentData.Alias.value,
                IsActive : objCurrentData.IsActive.value,
            }
        } 
        else if(error) {
            window.console.log('error Occured====> '+JSON.stringify(error))
        } 
    }


}
userDetails.js-meta.xml:

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>48.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__AppPage</target>
        <target>lightning__RecordPage</target>
        <target>lightning__HomePage</target>
    </targets>

</LightningComponentBundle>

Lightning Web Component Modal

lWCModal.html:

<template>
   <div class ="slds-theme_default">
       <div class="slds-p-around_medium">
        <lightning-button label="Show LWC Modal" variant= "brand" onclick={handleOpenModal}>
        </lightning-button>
       </div>
<template if:true={isOpenModal}>
    <div style="height: 500px;">
        <section role="dialog" tabindex="-1" aria-labelledby="modal-heading-01" aria-modal="true" aria-describedby="modal-content-id-1" class="slds-modal slds-fade-in-open"></section>
        <div class="slds-modal__container">
            <header class="slds-modal__header">
                <button class="slds-button slds-button_icon slds-modal__close slds-button_icon-inverse" title="Close" onclick={handleCloseModal}>
                    <lightning-icon icon-name="utility:close" variant="inverse" alternative-text="Close" size="medium">
                    </lightning-icon>
                    <span class="slds-assistive-text">Close</span>
                </button>
                <h2 id="modal-heading-01" class="slds-text-heading_medium slds-hyphenate">LWC Modal</h2>
            </header>
            <div class="slds-modal__content slds-p-around_medium" id="modal-content-id-1">
                <div class="slds-text-heading_small slds-text-align_center">
                    Welcome to LWC
                </div>
            </div>
            <footer class="slds-modal__footer">
                <lightning-button label="Cancel" variant="neutral" onclick={handleCloseModal}></lightning-button>
            </footer>
        </div>
    </section>
    <div class="slds-backdrop slds-backdrop_open"></div>
</div>
</template>
</div>

</template>

lWCModal.js:

import { LightningElement, track } from 'lwc';

export default class LWCModal extends LightningElement {
    @track isOpenModal = false;

    handleOpenModal(){
        this.isOpenModal =true;
    }
    handleCloseModal(){
        this.isOpenModal = false;
    }

}

lWCModal.js-meta.xml:

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>47.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__AppPage</target>
        <target>lightning__RecordPage</target>
        <target>lightning__HomePage</target>
    </targets>

</LightningComponentBundle>

Lightning Web Component OnLoad

lWCOnLoad.html:

<template>
    <div class="slds-text-heading_large slds-text-align_center">
        {greeting}
</div>
</template>

lWCOnLoad.js:

import { LightningElement, track } from 'lwc';

export default class LWCOnLoad extends LightningElement {

    @track greeting;

    connectedCallback(){
        this.greeting ='Welcome to LWC';
    }

}

Get Current User Id in Lightning Web Component

UserDetails.html: 

<template>

<div class="slds-text-heading_large slds-text-align_center">

   User Id : {currentUserId}

    </div>

</template>

UserDetails.js: 

import { LightningElement } from 'lwc'; 

import strUserId from '@salesforce/user/Id'




export default class UserDetails extends LightningElement { 

 userId = strUserId 




}