Understanding LWC folder structure

About ".html" File :
Default namespace for LWC = c
Suppose,1st LWC name    = helloWorld
Now, let's assume, you're trying to create 2nd LWC and you want to use the 1st LWC then below is the syntax.

<template>

<c-hello-world> <!-- [defaulNameSpace][hyphen] 
                  [each word of LWC 
                  name is separated 
                  with hyphen] --> 

</template>

Assume, if 1st LWC name = hello_World,
Now, let's assume, you're trying to create 2nd LWC and you want to use the 1st LWC then below is the syntax.

<template>

<c-hello_world> <!-- [defaulNameSpace][hyphen] 
                  [each word of LWC name is 
                  separated with underscore] -->
</template>

About ".Js" File:
example:

import { LightningElement } from 'lwc';

export default class HelloWorld extends LightningElement {
    //Your logic
}

Here,
lwc = Core module/Service component/library.
LightningElement = Custom wrapper of Standard HTML element.
import = Statement imports the LightningElement from the lwc module.
extends LightningElement = To create a js class for LWC.
If you observe the class name, it is following a naming convention called "Pascal case".
Pascal case = First letter of every word must be in Upper case.

Optional Files:

tHiNk gooD and dO thE bEsT.........MANJU NATH 🌝