You can create a Set in Apex as below

Set<String> colorSet = new Set<String> {'Red', 'Blue', 'Orange'};

To create list, use the syntax below

List<String> colorList = new List<String> {'Brown', 'Black', 'Green', 'White'};

Convert from List to Set

Set<String> newColorSet= new Set<String>(colorList);

Convert from Set to List

List<String> newColorList = new List<String>(colorSet);

You can also use other ways like using addAll

colorList.addAll(colorSet);
colorSet.addAll(colorList);

This post shows how to send an email using aura component in salesforce lightning.

EmailParticipants.cmp

<aura:component description="EmailParticipants" implements="flexipage:availableForAllPageTypes" controller="EmailParticipantController">
    <ltng:require styles="{!join(',', $Resource.YA_Styles + '/LT_YA_Global_Css.css', $Resource.YA_Styles + '/LT_External_Typography.css', $Resource.Y_Styles + '/psStyles.css', $Resource.Y_Styles + '/popupCSS.css')}"/>    

    <aura:attribute name="Spinner" type="boolean" default="false"/>
    <aura:handler name="init" action="{!c.doInit}" value="{!this}"/>

    <lightning:layoutItem size="12" smallDeviceSize="12" mediumDeviceSize="6" largeDeviceSize="12" padding="around-small">
        <lightning:card>
            
            <div class="slds-grid slds-wrap">
                <div class="slds-size_2-of-2">

                    <div class="slds-p-bottom_medium slds-p-left_medium slds-border_bottom">
                        <div class="slds-media">
                            <div class="slds-media__figure slds-p-right_medium">
                            <div class="slds-icon slds-page-header__icon ">
                                <lightning:icon iconName="action:email" size="small"/>
                            </div>
                            </div>
                            <div class="slds-media__body">
                                <div class="slds-p-top_small">
                                <h1>
                                    <span class="slds-page-header__title" title="Email Participants">Email Participants</span>
                                </h1>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="slds-grid slds-gutters slds-text-align_center slds-p-top--small">
                        <div class="slds-col">
                            <button class="slds-button slds-button_neutral" onclick="{!c.Send}">Send Email</button>                           
                        </div>
                    </div>

                    <div class="slds-p-around_medium">

                        <div class="slds-box">
                           
                        	<label class="slds-form-element__label" for="form-element-01">Email Address</label>
							<div class="slds-form-element__control">
								<input type="text" id="txtEmail" class="slds-input" />
							</div>
							<label class="slds-form-element__label" for="form-element-01">Subject</label>
							<div class="slds-form-element__control">
								<input type="text" id="txtSubject" class="slds-input" />
							</div>							
							<label class="slds-form-element__label" for="form-element-01">Message</label>
							<div class="slds-form-element__control">
								<lightning:inputRichText value="{!v.myMessage}" placeholder="Content for Participants"/>
                            </div>
                            <aura:if isTrue="{!v.showData}"> 
                            <label class="slds-form-element__label" for="form-element-01">Include Skills and Competency Report</label>
							<div class="slds-form-element__control">
								<ui:inputCheckbox aura:id="checkboxSkills" label="" change="{!c.showDatatable}"/>
                            </div>
                            
                            <label class="slds-form-element__label" for="form-element-01">Skills and Competency Table</label>
							<div class="slds-form-element__control">
								Nested Data Table!!
                            </div>
                            </aura:if>
                    
                        </div>
                     </div>

                </div>
            </div>
        </lightning:card>
    </lightning:layoutItem>

</aura:component>

EmailParticipantsController.js

({
	doInit : function(component, event, helper) {

    },
	Send : function(component, event, helper) {
        var email=helper._e('txtEmail').value;
        var Subject=helper._e('txtSubject').value;
        var Message=component.get("v.myMessage");        
        var regExpEmailformat = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 
        
        if(email==''){
            alert('Email-Id is required');
        }
        else if(Subject==''){
            alert('Subject is required');
        }
        else if(Message==''){
         alert('Message is required');
        }
        else{
            if(!email.match(regExpEmailformat)){
                alert("Invalid Email Id");
            }
            else{
                helper.SendEmail(component);
            }
        }
    },
    
    showSpinner: function(component, event, helper) {        
        component.set("v.Spinner", true); 
    },
    
    hideSpinner : function(component,event,helper){        
        component.set("v.Spinner", false);
	},
	
	
 })

EmailParticipantsHelper.js

({
	SendEmail : function(component) {
		   var email=this._e('txtEmail').value;
		   var Subject=this._e('txtSubject').value;
		   var Message=component.get("v.myMessage");   
		   var action=component.get("c.processEmail");
		   action.setParams({
			   email:email,
			   Subject:Subject,
			   Message:Message
		   })
		   action.setCallback(this,function(e){
			   if(e.getState()=='SUCCESS'){
				   var result=e.getReturnValue();
				   if(result=='Success'){
					   alert('Email Send Successfully!');
				   }
				   else{
					   alert(result);
				   }
			   }
			   else{
				   alert(JSON.stringify(e.getError()));
			   }
		   });
		   $A.enqueueAction(action);
	},
	   
	   _e:function(ele){
		   return document.getElementById(ele);
	   },
	})

EmailParticipantController.cls

public with sharing class EmailParticipantController {

    
    @AuraEnabled
    public static string processEmail(String email, String Subject, String Message){
        String sMessage='';
        try{
            Messaging.SingleEmailMessage mail = new Messaging.SingleEmailMessage();
            String[] toAddresses = new String[] {email}; 
                mail.setToAddresses(toAddresses);
            mail.setSubject(Subject);
            mail.setHtmlBody(Message);
            Messaging.SendEmailResult [] results = Messaging.sendEmail(new Messaging.SingleEmailMessage[] {mail});
            sMessage='Success';
        }
        catch(Exception ex){
            sMessage=ex.getLineNumber()+'\n'+ex.getCause()+'\n'+ex.getMessage()+'\n'+ex.getStackTraceString();
        }
        return sMessage;
    }


}

As we use aura:components, there will be times when we want to show or hide some component or text or table based on some condition. For example: if we are displaying a datatable based on a list of values. If the list is not empty, show the table otherwise, show a message that no results found.

<aura:component>
  <aura:attribute name="showText" type="boolean" default="true"/>  
  <aura:if isTrue="{!v.showText}"> 
    <!-- everything present here is rendered if showText is true -->
   <aura:set attribute="else">
    <!-- content renders if false -->
   </aura:set>
  </aura:if>
</aura:component>

The beauty of aura:if is when the isTrue condition is false the content doesn’t actually get created and hence never rendered. So, it will not consume time to create content and then hide it. So, that makes it even faster to render

How to use aura:if to check if List of values is empty or not

<aura:attribute name="tableColumns" type="List" default="[]"/>
   <aura:if isTrue="{!not(empty(v.instructorClassesData))}">    
         <aura:iteration var="session" items="{!v.instructorClassesData}" >
             <!-- Show data here  -->

          </aura:iteration>
                <aura:set attribute="else">
                    <div class="slds-grid slds-wrap">
                        <div class="slds-size_2-of-2">
                            There are no Upcoming classes
                        </div>
                    </div>
                </aura:set>  
</aura:if>

Do try it out and let me know if you have any questions!!

Stay Safe, Stay Home

Learn Salesforce:-)