From 8ab1779afdb85a3320abbfaf3d6e74ca1389fff6 Mon Sep 17 00:00:00 2001 From: Cole Peters Date: Fri, 6 Oct 2023 15:44:12 -0500 Subject: [PATCH] Add new Why Enhance page --- app/docs/md/learn/why-enhance.md | 42 ------ .../landing/axol/on-rainbow-and-cloud.mjs | 1 + app/elements/landing/stable-forever.mjs | 1 - app/pages/showcase.html | 86 ++++++------- app/pages/why-enhance.html | 121 ++++++++++++++++++ 5 files changed, 165 insertions(+), 86 deletions(-) delete mode 100644 app/docs/md/learn/why-enhance.md create mode 100644 app/pages/why-enhance.html diff --git a/app/docs/md/learn/why-enhance.md b/app/docs/md/learn/why-enhance.md deleted file mode 100644 index e1e28e3f..00000000 --- a/app/docs/md/learn/why-enhance.md +++ /dev/null @@ -1,42 +0,0 @@ ---- -title: Why Enhance? ---- - -Our mission is to enable anyone to build multi-page dynamic web apps while staying as close to the platform as possible. Enhance fills in the gaps to make building for the backend, and the browser a seamless experience for web authors and consumers. - -Modern JavaScript frameworks bring more problems than they solve; recreating native web platform features adding unnecessary weight and complexity, which is challenging to unravel. - -Enhance provides a dependable foundation built on standards-based web platform features, allowing developers to create web applications that are lightweight, flexible, and future-proof. - -Our criteria for success are: - -1. Author and deliver HTML pages - - - -**Enhance** should allow developers to write components as pure functions that return HTML. Then render them on the server to deliver complete HTML immediately available to the end user. - - - -2. Use Web Standards - - - -**Enhance** should take care of the tedious parts, allowing you to use today's Web Platform standards more efficiently. As new standards and platform features become generally available, Enhance will make way for them. - - - -3. Progressively enhance working HTML - - - -**Enhance** should allow for easy progressive enhancement so that working HTML can be further developed to add additional functionality with JavaScript. - - - -Now we spend more time adding new features and less time chasing breaking changes from dependencies. Your app can scale without ever-increasing build times and JavaScript payloads. - -With direct access to all available browser APIs (like forms, validation, and style encapsulation), there is no need to cobble together libraries and polyfills to develop a complex application. -Skeleton screens and spinners be gone. Flashes of unstyled content (FOUC) or layout shifts from delayed JavaScript don't belong anymore. - -Using just HTML, CSS, and a sprinkling of JavaScript, Enhance can build complex dynamic applications in harmony with the Web Platform, allowing developers to spend their time on interesting domain problems leading to more engaging products with less thrash. diff --git a/app/elements/landing/axol/on-rainbow-and-cloud.mjs b/app/elements/landing/axol/on-rainbow-and-cloud.mjs index d16b293b..e668de1e 100644 --- a/app/elements/landing/axol/on-rainbow-and-cloud.mjs +++ b/app/elements/landing/axol/on-rainbow-and-cloud.mjs @@ -3,6 +3,7 @@ export default function AxolOnRainbowAndCloud({ html }) { @@ -40,58 +40,58 @@ -
-
-

- Start with HTML. - Build your wildest dreams. -

-

+

+
+

+ Start with HTML. + Build your wildest dreams. +

+

With Enhance’s foundation in web standards, exceptionally fast performance, and peerless stability, the only limit to what you can build is your imagination. -

-

+

+

In this showcase, you’ll find some of our own example projects, as well as real world applications built by Enhance users across the globe. -

+

-
-

Want to have your Enhance project featured? Open a pull request or let us know on Discord!

-
+
+

Want to have your Enhance project featured? Open a pull request or let us know on Discord!

+
- + - - -
+ + +
- -
- + +
+ - Enhance Music is a music library and audio player app built with HTML and CSS, and progressively enhanced with a couple pinches of JavaScript. Despite being built as a traditional multipage website, Enhance Music features an audio player that persists across page loads, and some gorgeous interactive UI built entirely with web standards. - + Enhance Music is a music library and audio player app built with HTML and CSS, and progressively enhanced with a couple pinches of JavaScript. Despite being built as a traditional multipage website, Enhance Music features an audio player that persists across page loads, and some gorgeous interactive UI built entirely with web standards. + - - Our movies app is built with Enhance and The Movie Database API. With a strong focus on simplicity, performance, progressive enhancement, and offline local development capabilities, this application is set to transform your understanding of what can be done by focusing on the web platform. - + + Our movies app is built with Enhance and The Movie Database API. With a strong focus on simplicity, performance, progressive enhancement, and offline local development capabilities, this application is set to transform your understanding of what can be done by focusing on the web platform. + - - The job board for web performance professionals and people who want to work in the web performance industry. - + + The job board for web performance professionals and people who want to work in the web performance industry. + - - With wildfire season well upon us in North America, it’s a good idea to keep an eye on local air quality. Let’s get some real time data from the US EPA’s AirNow program. Even with a limited API request budget, we can get snappy results by caching and refreshing data on demand. All with features already built into Enhance. - + + With wildfire season well upon us in North America, it’s a good idea to keep an eye on local air quality. Let’s get some real time data from the US EPA’s AirNow program. Even with a limited API request budget, we can get snappy results by caching and refreshing data on demand. All with features already built into Enhance. + - - With clean and easy to follow code, and a modern, responsive interface, this example application demonstrates just how sophisticated you can get when building UI with web standards. This example app can also serve as a starting point for your own portfolio. - + + With clean and easy to follow code, and a modern, responsive interface, this example application demonstrates just how sophisticated you can get when building UI with web standards. This example app can also serve as a starting point for your own portfolio. + - - Stories created by a group of friends while playing Dungeons & Dragons. - -
- + + Stories created by a group of friends while playing Dungeons & Dragons. + +
+ -
+ diff --git a/app/pages/why-enhance.html b/app/pages/why-enhance.html new file mode 100644 index 00000000..0e874e9c --- /dev/null +++ b/app/pages/why-enhance.html @@ -0,0 +1,121 @@ + + + + + + + +
+
+

+ Why + Enhance? +

+ +
+

+ Our mission is to enable anyone to build multi-page dynamic web apps while staying as close to the web platform as possible. +

+

+ Enhance fills in the gaps to make building for both the backend and the browser a seamless experience for web authors and consumers. +

+
+ + + +
+ +
+

+ Modern JavaScript frameworks introduce more problems than they solve by attempting to recreate native web platform features, while at the same time adding unnecessary weight and complexity. This is challenging to unravel, especially when your framework or application dependencies break. +

+

+ Enhance approaches things differently. It provides a dependable foundation built on standards-based web platform features, while offering quality of life improvements for developers and happy paths to delivering exceptional user experience. This allows developers to create web applications that are lightweight, flexible, and future-proof. +

+ + + +

+ Our criteria for success +

+

+ Author and deliver HTML pages +

+

+ Enhance should allow developers to write components as pure functions that return HTML. These functions should render on the server to deliver complete HTML, available immediately to the end user. +

+ +

+ Use web standards +

+

+ Enhance should take care of the tedious parts of development, allowing you to use today’s web platform features more efficiently. As new standards and platform features become generally available, Enhance will make way for them. +

+ +

+ Progressively enhance working HTML +

+

+ Enhance should allow for easy progressive enhancement, so that working HTML can be further upgraded to include additional functionality with JavaScript. +

+ +

+ The result +

+

+ With Enhance, you spend more time adding new features to your projects and less time chasing breaking changes from dependencies. Your app can scale without ever-increasing build times and JavaScript payloads. +

+

+ With direct access to all available browser APIs (like forms, validation, and style encapsulation), there is no need to cobble together libraries and polyfills to develop a complex application. Skeleton screens and spinners be gone! Flashes of unstyled content (FOUC) or layout shifts from delayed JavaScript don’t belong anymore. +

+

+ Using just HTML, CSS, and a sprinkling of JavaScript, Enhance unlocks the delivery of complex dynamic applications in harmony with the web platform. It empowers developers to spend their time on interesting domain problems, leading to more engaging products with less thrash. +

+

+ Experience how joyful web development can be — get started with Enhance today! +

+ + +
+ + +
+ + + +