Technical overview

Author: easycoder

resources/ecs/main.ecs

@@ -18,7 +18,7 @@
 	button AboutButton
 	button PhilosophyButton
 	button CodexButton
-    button ThisIsMeButton
+  button TechnicalButton
 	hr Rule
 	a ShowNotes
 	module ShowdownModule
@@ -194,13 +194,13 @@ BuildPage:
 	end
 
 	create ButtonItem in ButtonList
-	create ThisIsMeButton in ButtonItem
-	set the style of ThisIsMeButton to ButtonStyle
-	set style `margin-top` of ThisIsMeButton to `0.25em`
-	set the text of ThisIsMeButton to `This is Me`
-	on click ThisIsMeButton
+	create TechnicalButton in ButtonItem
+	set the style of TechnicalButton to ButtonStyle
+	set style `margin-top` of TechnicalButton to `0.25em`
+	set the text of TechnicalButton to `Technical Overview`
+	on click TechnicalButton
 	begin
-		location `/thisisme/index.html`
+		location `/technical.html`
 	end
 
 	create Notes in Main

resources/ecs/technical.ecs

@@ -0,0 +1,48 @@
+!	EasyCoder Main
+
+	script Technical
+    
+	div Body
+	div Main
+	div Header
+	div Document
+	img Banner
+	hr Rule
+	a ShowNotes
+	module ShowdownModule
+	variable Script
+	
+	create Body
+	if mobile
+		set the style of Body to `width:100%`
+	else
+		set the style of Body to `width:100%;max-width:1200px;margin:0 auto`
+	
+	create Header in Body
+	if mobile
+		set the style of Header to `text-align:center`
+	else
+		set the style of Header to `margin:0 2em;text-align:center`
+	
+	create Banner in Header
+	if not mobile set the style of Banner to `width:50%;margin:0 auto`
+	set attribute `src` of Banner to `resources/img/banner.png`
+	
+	create Rule in Body
+	
+	create Main in Body
+	if not mobile
+	begin
+		set style `display` of Main to `flex`
+	end
+	
+	create Document in Main
+	set the style of Document to `flex:1`
+
+	rest get Script from `/resources/ecs/showdown.ecs`
+	run Script with Document as ShowdownModule
+
+	rest get Script from `/resources/md/technical.md`
+  send Script to ShowdownModule
+
+	stop

resources/md/home.md

@@ -12,7 +12,7 @@
 
 - Any part of the screen can be replaced with new content taken from a remote server without the need to reload the page.
 
-Although these features are the ones most likely to be used by the averge website owner, ~ec~ can do a lot more, to the point it can be used to build entire interactive websites without a single line of JavaScript ever being seen. A good example is our own site, that you're reading now.
+Although these features are the ones most likely to be used by the averge website owner, ~ec~ can do a lot more, to the point it can be used to build entire interactive websites without a single line of HTML or JavaScript ever being seen. A good example is our own site, that you're reading now.
 
 ### Do I need to learn programming? ###
 

resources/md/philosophy.md

@@ -1,9 +1,11 @@
 # Our philosophy #
+
 "It's very easy to make things complicated, but it's very hard to make them simple".
 
 ~ec~ **_Software_** has a mission: to make complicated things simple. We created ~ec~ because JavaScript is just too hard for most people to learn, yet many of the things that people want it to do can be easily expressed in English. So we figured if we can't make everyone a programmer, let's make programming easy for everyone. ~ec~ is the result of our efforts.
 
 ## Analysis ##
+
 The mainstream software industry is driven by the desires of top developers to achieve results quickly. While this works quite well for big projects and in large teams, there are 2 areas in which it falls down badly. The first is that it fails to allow for people with lower skill levels, and the second - deriving from the first - is that it takes little to no account of future maintenance needs.
 
 Although JavaScript is a mature programming language it is continually evolving and in the process becoming more complex. Fortunately, because of the need for older websites to go on working, it continues to support old code. This means a project can be written using a 10-year old version of JavaScript (if that is the preference of the programmer) with little risk of it not working.
@@ -15,10 +17,13 @@ The language itself, however, is only half of the problem. The other half is the
 Large professional programming teams do not see these problems; they are unaffected by them as they always have the resources they need to maintain continuity. For many smaller projects, however, this is far from being the case.
 
 ## A fresh view ##
+
 The great majority of websites can be described in plain English, if necessary by focusing on one block at a time. Indeed, if a website is too complex to describe it's probably also too complex to use. So the idea that complex tools and frameworks are essential is for many sites a flawed one unless you start with the view that frameworks are always good and should be used at all times.
 
 Here's a very approximate calculation. We estimate the total amount of effort that will be expended during development and maintenance, then multiply each part by the cost of the people that will be needed. It immediately becomes clear that there's a trade-off between the complexity of the development tools and the skill levels of the developers. With less complex tools, development may take longer (though we would in fact dispute that because simpler tools are quicker to learn) but cost less, and the maintenance cost is also lowered. There are so many factors in play that the calculation can only be heuristic (i.e. not rigorous), but if we compare building and running a new Facebook with, say, a local real-estate website then it's quite likely the former would benefit from the latest technology but the latter might well not.
 
 It's in the latter category that tools like ~ec~ provide a viable alternative to the current mainstream. Any website that will require maintenance at a level that does not justify the retention of high-level skills will become unmaintainable if development assumes such skills will always be present.
 
-Next: It's about language, not structure
+## Technical overview ##
+
+~ec~ is about language, not structure. For a brief summary of how it works, see here.

resources/md/technical.md

@@ -0,0 +1,5 @@
+# Technical Overview #
+
+~ec~ is a scripting language for browsers, written in JavaScript. It comprises a compiler and a runtime and by using a pluggable, modular architecture it can handle projects of any size.
+
+Modern web programming puts structure above content. A plethora of frameworks exist to provide a structural basis for any web project. Many of these are explicitly component oriented, React being the leading example. It is hard to be taken seriously as a web programmer without a deep understanding of at least one such framework.

technical.html

@@ -0,0 +1,18 @@
+<html lang="en">
+
+<head>
+	<meta charset="UTF-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<title>EasyCoder - coding made simple</title>
+    <link rel='stylesheet' href='resources/css/styles.css' type='text/css' media='all' />
+	<script type='text/javascript' src='easycoder/easycoder.js?ver=3.0.0'></script>
+</head>
+
+<body>
+	<pre id="easycoder-script" style="display:none">
+	variable Script
+	rest get Script from `/resources/ecs/technical.ecs`
+	run Script
+	</pre>
+	</html>
+</body>