ExtJS 6 "Hello World" Application - Modern Toolkit

Posted By Vitaliy | May 05, 2017 | ExtJS 6.0.0
0 116
This is minimal html page code to run ExtJS version 6 in Modern Toolkit.
Note: that it's recommended to add html DOCTYPE for this version of library.
Also there is a way to avoid including of whole ExtJS library (ext-modern-all.js, 1053Kb). You can find demo in my another post and more details here.
Also be aware that in 6.0.0 there is no triton theme in modern toolkit.

<!DOCTYPE html>
<html>
    <head>
        <link  href="/ext/6.0.0/build/modern/theme-neptune/resources/theme-neptune-all.css" rel="stylesheet" />
        <script src="/ext/6.0.0/build/ext-modern-all.js"></script>
        <script src="/ext/6.0.0/build/modern/theme-neptune/theme-neptune.js"></script>
    </head>
    <body>
        <script>
			Ext.application({
				launch : function() {
					Ext.Msg.alert('Welcome', 'Hello, World!');
				}
			});
        </script>
    </body>
</html>

Js Code

Ext.application({
    launch : function() {
        Ext.Msg.alert('Welcome', 'Hello, World!');
    }
});
            

ExtJS 6 "Hello World" Application

Posted By Vitaliy | May 05, 2017 | ExtJS 6.0.0
0 124
This is minimal html page code to run ExtJS version 6.
Note: that it's recommended to add html DOCTYPE for this version of library.
Also there is a way to avoid including of whole ExtJS library (ext-all.js, 2021Kb). You can find demo in my another post and more details here.

<!DOCTYPE html>
<html>
	<head>
		<link  href="/ext/6.0.0/build/classic/theme-triton/resources/theme-triton-all.css" rel="stylesheet" />
		<script src="/ext/6.0.0/build/ext-all.js"></script>
		<script src="/ext/6.0.0/build/classic/theme-triton/theme-triton.js"></script>
	</head>
	<body>
		<script>
			Ext.onReady(function() {
				Ext.Msg.alert('Welcome', 'Hello, World!');
			});
		</script>
	</body>
</html>

Js Code

Ext.onReady(function() {
    Ext.Msg.alert('Welcome', 'Hello, World!');
});