Code in this post can be obsolete, however, principles and theory may still apply.
We don’t create HTML files too often these days, nevertheless, here is the pattern.
<!-- vim: ts=2:sw=2:nu:fdc=2:spell An Application Page @author Ing.Jozef Sakáloš @copyright (c) 2008, by Ing. Jozef Sakáloš @date 2. April 2008 @version $Id$ @license application.html is licensed under the terms of the Open Source LGPL 3.0 license. Commercial use is permitted to the extent that the code/component(s) do NOT become part of another Open Source or Commercially licensed development library or toolkit without explicit permission. License details: http://www.gnu.org/licenses/lgpl.html --> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css"> <link id="theme" rel="stylesheet" type="text/css" href="css/empty.css"> <link rel="stylesheet" type="text/css" href="css/icons.css"> <link rel="stylesheet" type="text/css" href="css/application.css"> <link rel="shortcut icon" href="img/extjs.ico"> <script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="ext/ext-all-debug.js"></script> <script type="text/javascript" src="application.js"></script> <title id="page-title">Application Title</title> </head> <body> <!-- delete following line if you don not want stats included --> <?if("learnfromsaki.com"===$_SERVER["SERVER_NAME"])include("stats.php");?> </body> </html> <!-- eof -->
Basic HTML Page
<!-- Do NOT put any DOCTYPE here unless you want problems in IEs. --> <html> <!-- Each valid html page must have a head; let's create one. --> <head> <!-- The following line defines content type and utf-8 as character set. --> <!-- If you want your application to work flawlessly with various local --> <!-- characters, just make ALL strings, on the page, json and database utf-8. --> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <!-- Ext relies on its default css so include it here. --> <!-- This must come BEFORE javascript includes! --> <link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css"> <!-- Include here your own css files if you have them. --> <!-- First of javascript includes must be an adapter... --> <script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script> <!-- ...then you need the Ext itself, either debug or production version. --> <script type="text/javascript" src="ext/ext-all-debug.js"></script> <!-- Include here your extended classes if you have some. --> <!-- Include here you application javascript file if you have it. --> <!-- Set a title for the page (id is not necessary). --> <title id="page-title">Title</title> <!-- You can have onReady function here or in your application file. --> <!-- If you have it in your application file delete the whole --> <!-- following script tag as we must have only one onReady. --> <script type="text/javascript"> // Path to the blank image must point to a valid location on your server Ext.BLANK_IMAGE_URL = 'ext/resources/images/default/s.gif'; // Main application entry point Ext.onReady(function() { // write your application here }); </script> <!-- Close the head --> </head> <!-- You can leave the body empty in many cases, or you write your content in it. --> <body></body> <!-- Close html tag at last --> </html>
I'm a well seasoned developer, consultant and educator of web applications based mainly on Sencha libraries, PHP, MySQL and Node.js. Besides (Apple) computers, I love photography and mountain biking.
Follow me:
Latest posts by saki (see all)
- Ext, Angular, React, and Vue - 27. June 2019
- The Site Resurgence - 11. February 2018
- Configuring ViewModel Hierarchy - 19. June 2015
4 Responses
I include scripts inside the body. browsers will load them much faster , and the same time will already show background/ whatever. it’s because some simultaneous-loading limitations for the scripts in header.
Is there any real reason to not have a DOCTYPE nowadays? This info is from 2008, we are in 2010, is it still valid?
This warning is also written here:
http://www.extjs.com/learn/Tutorial:Application_Layout_for_Beginners
vim modeline is not exactly at the beginning of the file so ~/.vimrc should contain entry:
I have added doctype to this template. If you encounter some strange rendering issues in Internet Explorer, one of the first steps is to remove the doctype and let IE run in quirks mode.