This sample website is built using Code Modules’ techniques. Code Modules has now been released. The open source files for building this site can be accessed at GitHub. This website uses content derived from Code Modules’ documentation and repurposed to fit various page templates (altered for this site) provided by Start Bootstrap’s Modern Business theme.
Code Modules itself is built upon the use of BBEdit’s include system which is a dependency. If you don’t wish to use BBEdit, a paid program, Code Modules won’t work for you.
There’s a website for Code Modules documentation.
GitHub repo for the files that make this website. Shows Code Modules in use.
There are five high level module types. Each of the items below are linked to the documentation for that type. See the Portfolio pages to see this same content used differently—part of the power of code modules.
Markup modules return a bit of markup. Each of these modules live as a subfolder of
app/modules/markup/. Most websites will have many markup modules.
The Page module is located at
app/modules/pages/. Top level HTML pages contain almost no content other than a call to the Pages module. The Pages module sets a number of global variables and then calls all the other modules needed to build the top level HTML page.
Navigation is always an important website feature. The Nav module returns the markup necessary for both desktop and mobile navigation. Sometimes, nav markup will be used for headers, and sometimes for sidebars and footers. But, with a nav module, it all comes from the same source of data.
Websites usually have pieces of markup that don’t deserve a whole module — they need to be served via something akin to a traditional include. It can still be handy to separate them into a separate file and allow them to use global variables. I use a special Elements module for this purpose.