What is the difference between .HLSL and .VS and .PS code for DirectX11?

Question

I am following Rastertek tutorials, http://www.rastertek.com/dx11s2tut04.html

In this code the shaders are compiled from *.vs and *.ps files

result = D3DCompileFromFile("light.vs", NULL, NULL, "LightVertexShader", "vs_5_0", D3D10_SHADER_ENABLE_STRICTNESS, NULL, &vertexShaderBuffer, &errorMessage);

result = D3DCompileFromFile("light.ps", NULL, NULL, "LightPixelShader", "ps_5_0", D3D10_SHADER_ENABLE_STRICTNESS, NULL, &pixelShaderBuffer, &errorMessage);

The tutorial makes a mention of using HLSL, which is also used by most tutorials online, but HLSL doesn't look anything like the *.vs and *.ps files, HLSL looks more like C++ code and has a Main() function.

Are these essentially the same shaders using different languages? Which one is newer and better to use?

Thanks,