Drupal 8 custom block with html and javascript In Drupal 8 what is the process for creating blocks with html and javascript?

Here is my sample code for creating the block

class TopNewsBlock extends BlockBase {

  /**
   * {@inheritdoc}
   */
  public function build() {
     //Fetch data
     return array(
      'type' =&gt; 'markup',
      '#markup' =&gt; '&lt;table id="example_table"&gt;&lt;/table&gt;',
      '#attached' =&gt; array(
        'library' =&gt;  array(      
          'custom_cms_blocks/dataTables.dataTablesjs',
          'custom_cms_blocks/top-news-library'
        ),
      ),
     ); 
  } 

}


It works but the problem I have is - I want to seperate out the html code from the php code. Is it possible to include a html file within the block just like the way a javascript file is attached as a library?
You need to use hook_theme() in your module, and declare a new Twig template that you want to use for your block.

Here's an example that needs to go to YOUR_MODULE.module file:

function YOUR_MODULE_theme() {
  return [
    'YOUR_TEMPLATE_KEY' =&gt; [
      // Here you can pass any variables you want, if necessary.
      'variables' =&gt; ['var1' =&gt; NULL],
    ],
  ];
}


Then create a folder called /templates in your custom module, and YOUR_TEMPLATE_KEY.html.twig file where you can have any markup you want. See below how to use the variables you pass to the template:

&lt;div id="your-block"&gt;
  {{ var1 }}
&lt;/div&gt;


Finally, to use it:

public function build() {
  return [
    '#theme' =&gt; 'YOUR_TEMPLATE_KEY',
    '#var1' =&gt; 'Variable one passed here',
  ];
}


Hope this helps.