Magento – Magento 2 – How to create custom grid menu in admin

I want to create a grid menu in the admin panel. I'm stuck at creating layout using components. I have some records in a table. Now how can I display it in the admin grid?

The following is the code that I now used.

I created Hiren/Employee/etc/module.xml:

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="Hiren_Employee" setup_version="0.0.1"/>
</config>

I created **Hiren/Employee/etc/adminhtml/routes.xml*:

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd">
<router id="admin">
    <route id="employee" frontName="employee">
        <module name="Hiren_Employee"/>
    </route>
</router>
</config>

I created Hiren/Employee/etc/adminhtml/menu.xml:

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Backend:etc/menu.xsd">
<menu>
    <add id="Hiren_Employee::EmpManage" title="Manage Employee" module="Hiren_Employee" sortOrder="51" resource="Hiren_Employee::EmpManage"/>
    <add id="Hiren_Employee::viewData" title="View" module="Hiren_GridMenu" sortOrder="10" action="employee/view" resource="Hiren_Employee::viewData" parent="Hiren_Employee::EmpManage"/>       
</menu>
</config>

I created Hiren/Employee/Setup/InstallSchema.php:

<?php

namespace Hiren\Employee\Setup;

class InstallSchema implements \Magento\Framework\Setup\InstallSchemaInterface
{
    public function install(\Magento\Framework\Setup\SchemaSetupInterface $setup, \Magento\Framework\Setup\ModuleContextInterface $context)
    {
        $installer = $setup;
        $installer->startSetup();
        if (!$installer->tableExists('emp_table'))
        {
            $table = $installer->getConnection()->newTable($installer->getTable('emp_table'))
            ->addColumn('no', \Magento\Framework\DB\Ddl\Table::TYPE_INTEGER, null, ['identity' => true, 'unsigned' => true, 'nullable' => false, 'primary' => true], 'no')
            ->addColumn('name', \Magento\Framework\DB\Ddl\Table::TYPE_TEXT, 255, ['nullable => false'], 'Name')
            ->addColumn('city', \Magento\Framework\DB\Ddl\Table::TYPE_TEXT, 255, [], 'city')->setComment('Employee Table');

            $installer->getConnection()->createTable($table);
            $installer->getConnection()->addIndex($installer->getTable('emp_table'), $setup->getIdxName($installer->getTable('emp_table'), ['no', 'name', 'city'], \Magento\Framework\DB\Adapter\AdapterInterface::INDEX_TYPE_FULLTEXT), ['no', 'name', 'city'], \Magento\Framework\DB\Adapter\AdapterInterface::INDEX_TYPE_FULLTEXT);
        }
        $installer->endSetup();
    }
}

I created Hiren/Employee/Controller/Adminhtml/view/Index.php:

<?php

namespace Hiren\Employee\Controller\Adminhtml\view;

class Index extends \Magento\Backend\App\Action
{
    protected $resultPageFactory = false;

    public function __construct(\Magento\Backend\App\Action\Context $context, \Magento\Framework\View\Result\PageFactory $resultPageFactory)
    {
        parent::__construct($context);
        $this->resultPageFactory = $resultPageFactory;
    }

    public function execute()
    {
        $resultPage = $this->resultPageFactory->create();
        $resultPage->getConfig()->getTitle()->prepend((__('VIEW')));
        return $resultPage;
    }
}