Firing Event from Lightning component and handling it in VF page

SK_AccListView.cmp

<aura:component controller="SK_AccListViewController">
    <aura:attribute name="recList" type="List" />
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    <aura:registerEvent name="skEvent" type="c:SK_AccListViewEvent"/> 
    
    <aura:handler event="aura:waiting" action="{!c.showSpinner}"/>
    <aura:handler event="aura:doneWaiting" action="{!c.hideSpinner}"/>
    <div class="slds-align--absolute-center">
        <lightning:spinner aura:id="spinner" variant="brand" size="large" class="slds=hide"/>
    </div>
    
    <table class="slds-table slds-table--bordered slds-table--cell-buffer">
            <thead>
                <tr class="slds-text-title--caps">
                    <th scope="col">Actions</th>
                    <th scope="col">Name</th>
                    <th scope="col">Type</th>
                    <th scope="col">Industry</th>
                </tr>
            </thead>
            <aura:iteration items="{!v.recList}" var="item">
            <tr>
                <td>
                    <lightning:button variant="brand" label="Send AccountId through Events" value="{!item.Id}" onclick="{! c.fireEvent }" />
                </td>
                <td> {!item.Name}</td>
                <td> {!item.Type}</td>
                <td> {!item.Industry}</td>
            </tr>
            </aura:iteration>
            </table>
	
</aura:component>

SK_AccListViewApp.app

<aura:application extends="ltng:outApp">
    <c:SK_AccListView />
</aura:application>

SK_AccListViewAppVF.page

<apex:page controller="SK_AccListViewAppVFController" showHeader="false" sidebar="false" id="pg1">
    <apex:includeLightning />
    <apex:form > 
    	<apex:pageblock title="Demo: Passing value from Lightning Component to VF page">
        	<apex:pageblocksection columns="1">
            	<apex:outputpanel >
                    <apex:pageblocksection title="Section to display value passed from Lightning Component through event" columns="1">
                    	<apex:outputLabel value="Account Id passed from Lightning Component" for="inptxt"/>
                        <apex:inputtext value="{!PassedValueFromCmp}" id="inptxt"/>
                    </apex:pageblocksection>
                </apex:outputpanel>
                <apex:outputpanel >
                    <apex:pageblocksection columns="1" Title="Lighnting Component Container">
                    	<div id="lightning" style="float:left"></div>
                    </apex:pageblocksection>
                </apex:outputpanel>
                
            </apex:pageblocksection>
        </apex:pageblock>
    </apex:form>
    
	<script>
    	//if you don't have namespace in your org then on VF page use "c:" instead of "skforce:" like c:SK_AccListViewApp
    	$Lightning.use("skforce:SK_AccListViewApp", function() {
		    $Lightning.createComponent("skforce:SK_AccListView", {}, "lightning", function(){
                $A.eventService.addHandler({ "event": "skforce:SK_AccListViewEvent", "handler" : VFEventHandler});

		    });
		}); 
	
    function VFEventHandler(event){
        console.log('event is handled by VF page function');
        var myEventData = event.getParam("accountIdPassedFromEvent");
    	console.log('value passed from component;'+myEventData);
        document.getElementById("pg1:j_id3:j_id4:j_id5:j_id7:inptxt").value = myEventData;
        console.log('value assigned to VF page variable:'+myEventData);
    }
	</script>
</apex:page>

SK_AccListViewAppVFController.cls

public class SK_AccListViewAppVFController {
    public string PassedValueFromCmp{get;set;} 
}

SK_AccListViewController.cls

public class SK_AccListViewController {
    
    @auraEnabled
    public static List<Account> findRecords(){
        List<Account> returnList=new List<Account>();
        returnList=[select id,name,type,industry from Account order by LastModifiedDate DESC Limit 10];
      return returnList;
    }

}

SK_AccListViewController.js

({
	doInit : function(component, event, helper){
        var action = component.get("c.findRecords");
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                var res = response.getReturnValue();
                component.set("v.recList",res);
            }else if(state === "ERROR"){
                alert('Problem with connection. Please try again.');
            }
        });
		$A.enqueueAction(action);
     },
    fireEvent : function (component, event, helper){
        console.log('event get fired from SK_AccListView Component');
        var selectedAccountId = event.getSource().get('v.value');
        console.log('**********selectedAccountId:'+selectedAccountId);
        var myEvent = $A.get("e.skforce:SK_AccListViewEvent");
	    myEvent.setParams({
                accountIdPassedFromEvent:selectedAccountId
            });
        console.log('firing event from component controller');
	    myEvent.fire();
    },
    showSpinner: function(component, event, helper) {
        var spinner = component.find("spinner");
        $A.util.removeClass(spinner, "slds-hide");
    },
    hideSpinner: function(component, event, helper) {
        var spinner = component.find("spinner");
        $A.util.addClass(spinner, "slds-hide");
    }
})

SK_AccListViewEvent.evt

<aura:event type="APPLICATION"  >
    <aura:attribute name="accountIdPassedFromEvent" type="string"/>
</aura:event>