mirror of
https://github.com/EiffelSoftware/eiffel-org.git
synced 2025-12-06 14:52:03 +01:00
Added slides used to record video related to EWF.
git-svn-id: https://svn.eiffel.com/eiffel-org/trunk@1425 abb3cda0-5349-4a8f-a601-0c33ac3a8c38
This commit is contained in:
jfiat
93
tutorial/EWF/0-basic-service.html
Normal file
93
tutorial/EWF/0-basic-service.html
Normal file
@@ -0,0 +1,93 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
|
||||
<title>Eiffel Web Framework: basic service</title>
|
||||
<meta name="description" content="How to create a basic web service with Eiffel ">
|
||||
<meta name="author" content="Jocelyn Fiat">
|
||||
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui">
|
||||
|
||||
<link rel="stylesheet" href="../res/reveal.js/css/reveal.min.css">
|
||||
<link rel="stylesheet" href="../res/theme/eiffel/eiffel.css" id="theme">
|
||||
<!--
|
||||
<link rel="stylesheet" href="../res/reveal.js/css/theme/black.css" id="theme">
|
||||
-->
|
||||
|
||||
<!-- Code syntax highlighting -->
|
||||
<link rel="stylesheet" href="../res/reveal.js/lib/css/zenburn.css">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div class="reveal">
|
||||
<div class="slides">
|
||||
<section>
|
||||
<h2><span class="logo"></span>Simple web application <br/>using Eiffel?</h2>
|
||||
<br/>
|
||||
<ul>
|
||||
<li><strong>level</strong>: basic</li>
|
||||
<li><strong>requirements</strong>: EiffelStudio 14.11 installed</li>
|
||||
<li><strong>goal</strong>: web application that return "Hello Web!" in browser.</li>
|
||||
</ul>
|
||||
<div class="footer">©2015 <a href="https://eiffel.org">eiffel.org</a></div>
|
||||
</section>
|
||||
<section>
|
||||
<h3>EWF: the Eiffel Web Framework</h3>
|
||||
<ul>
|
||||
<li><strong>WSF</strong>: Web Server Foundation library</li>
|
||||
<li><strong>Connectors</strong>: CGI, libFCGI, standalone Eiffel httpd <strong>"nino"</strong></li>
|
||||
<br/>
|
||||
Let's use wsf and wsf/default/nino libraries.
|
||||
</ul>
|
||||
<div class="footer">©2015 <a href="https://eiffel.org">eiffel.org</a></div>
|
||||
</section>
|
||||
<section>
|
||||
<h3>Into the code</h3>
|
||||
<ul>
|
||||
<li>Inherit from WSF_DEFAULT_SERVICE</li>
|
||||
<li>Implement routine <br/><pre><code data-trim contenteditable>execute (req: WSF_REQUEST; res: WSF_RESPONSE)</code></pre></li>
|
||||
<li>Update option to use port 9090</li>
|
||||
<li>Open <a href="http://localhost:9090/">http://localhost:9090</a></li>
|
||||
</ul>
|
||||
<div class="footer">©2015 <a href="https://eiffel.org">eiffel.org</a></div>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Thank you for watching</h2>
|
||||
<br/>
|
||||
<ul>
|
||||
<li>https://eiffel.com/</li>
|
||||
<li>https://github.com/EiffelWebFramework/EWF/</li>
|
||||
</ul>
|
||||
<div class="footer">©2015 <a href="https://eiffel.org">eiffel.org</a></div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="../res/reveal.js/lib/js/head.min.js"></script>
|
||||
<script type="text/javascript" src="../res/reveal.js/js/reveal.min.js"></script>
|
||||
<script type="text/javascript" src="../res/reveal.js/plugin/highlight/highlight.js"></script>
|
||||
<script>
|
||||
// Full list of configuration options available here:
|
||||
// https://github.com/hakimel/reveal.js#configuration
|
||||
Reveal.initialize({
|
||||
minScale: 0.2,
|
||||
maxScale: 1.1,
|
||||
center: false,
|
||||
transition: 'linear', // none/linear/fade/slide/convex/concave/zoom
|
||||
//slideNumber: false,
|
||||
//overview: true,
|
||||
history: true
|
||||
|
||||
// transitionSpeed: 'slow',
|
||||
// backgroundTransition: 'slide'
|
||||
});
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
229
tutorial/EWF/1-url-dispatching.html
Normal file
229
tutorial/EWF/1-url-dispatching.html
Normal file
@@ -0,0 +1,229 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
|
||||
<title>Eiffel Web Framework: basic service</title>
|
||||
<meta name="description" content="Using EWF Router to dispatch URL">
|
||||
<meta name="author" content="Jocelyn Fiat">
|
||||
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui">
|
||||
|
||||
<link rel="stylesheet" href="../res/reveal.js/css/reveal.min.css">
|
||||
<link rel="stylesheet" href="../res/theme/eiffel/eiffel.css" id="theme">
|
||||
<!--
|
||||
<link rel="stylesheet" href="../res/theme/ewf/ewf.css" id="theme">
|
||||
<link rel="stylesheet" href="../res/reveal.js/css/theme/black.css" id="theme">
|
||||
-->
|
||||
<!-- Code syntax highlighting -->
|
||||
<style>
|
||||
span.hljs-keyword { font-weight: bold; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="reveal">
|
||||
<div class="slides">
|
||||
<section class="full">
|
||||
<h2><span class="logo"></span>Eiffel Web Framework</h2>
|
||||
<br/>
|
||||
<h1>EWF Router</h1>
|
||||
<ul>
|
||||
<li>What is URL dispatching ?</li>
|
||||
<li>How to use the WSF_ROUTER component.</li>
|
||||
</ul>
|
||||
<br/>
|
||||
<br/>
|
||||
<p><em>Requirements: EiffelStudio 14.05 or upper</em></p>
|
||||
<div class="footer">©2015 <a href="https://eiffel.org">eiffel.org</a></div>
|
||||
</section>
|
||||
<section>
|
||||
<h2>URL dispatching</h2>
|
||||
<ul>
|
||||
<li>Incoming requests URL are handled by the server application.</li>
|
||||
<br/>
|
||||
<li><strong>Mapping</strong> URL or template to specific handler is called <strong>dispatching</strong> the URL, or <strong>routing</strong> the request.</li>
|
||||
<pre>Examples of URL mappings:
|
||||
|
||||
https://example.com<strong>/contact</strong> => contact_handler
|
||||
https://example.com<strong>/user/bob</strong> => user_handler -- "bob" as parameter
|
||||
https://example.com<strong>/user/john</strong> => user_handler -- "john" as parameter
|
||||
https://example.com<strong>/page/foo</strong> => page_handler -- "foo" as parameter
|
||||
https://example.com<strong>/page/bar</strong> => page_handler -- "bar" as parameter</pre>
|
||||
<li>Templates can be the URL path itself, URI-template, or ...</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Using WSF_ROUTER</h2>
|
||||
<pre><code data-trim contenteditable class="eiffel">execute (req: WSF_REQUEST; res: WSF_RESPONSE)
|
||||
local
|
||||
router: WSF_ROUTER
|
||||
do
|
||||
create router.make (3)
|
||||
--| /contact => contact_handler
|
||||
router.map (create {WSF_URI_MAPPING}.make (
|
||||
"/contact", contact_handler))
|
||||
--| GET /page/{title} => page_handler
|
||||
router.map_with_request_methods (create {WSF_URI_TEMPLATE_MAPPING}.make (
|
||||
"/page/{title}", page_handler), "GET")
|
||||
--| POST /page/{title} => post_page_handler
|
||||
router.map_with_request_methods (create {WSF_URI_TEMPLATE_MAPPING}.make (
|
||||
"/page/{title}", page_handler), "POST")
|
||||
|
||||
--| Execute router ...
|
||||
router.dispatch (req, res, Void)
|
||||
</code></pre>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>Helpers classes</h2>
|
||||
<p>To help coding URL routing, setup and execution,<br/>
|
||||
EWF provides a set of helper classes.</p>
|
||||
<br/>
|
||||
<ul>
|
||||
<li><strong>WSF_ROUTED_SERVICE</strong>:
|
||||
<ul><li>only <strong>setup_router</strong> needs to be implemented.</li>
|
||||
<li>and optionaly the <strong>execute_default</strong> routine.</li>
|
||||
</ul>
|
||||
<br/>
|
||||
<li><strong>WSF_*_HELPER_FOR_ROUTED_SERVICE</strong> classes make mapping code simpler.</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section>
|
||||
<h4>Routed service</h4>
|
||||
<pre><code class="eiffel">class APPLICATION
|
||||
inherit
|
||||
WSF_DEFAULT_SERVICE redefine initialize end
|
||||
WSF_ROUTED_SERVICE -- To have the "routed" behavior
|
||||
|
||||
feature -- Initialization
|
||||
initialize
|
||||
do
|
||||
Precursor
|
||||
initialize_router
|
||||
end
|
||||
|
||||
setup_router
|
||||
do
|
||||
--| /contact => contact_handler
|
||||
router.map (create {WSF_URI_MAPPING}.make (
|
||||
"/contact", contact_handler))
|
||||
--| GET /page/{title} => page_handler
|
||||
router.map_with_request_methods (create {WSF_URI_TEMPLATE_MAPPING}.make (
|
||||
"/page/{title}", page_handler), "GET")
|
||||
--| POST /page/{title} => post_page_handler
|
||||
router.map_with_request_methods (create {WSF_URI_TEMPLATE_MAPPING}.make (
|
||||
"/page/{title}", post_page_handler), "POST")
|
||||
end
|
||||
</code></pre>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h4>Using all helper classes...</h4>
|
||||
<pre><code class="eiffel">class APPLICATION
|
||||
inherit
|
||||
WSF_DEFAULT_SERVICE redefine initialize end
|
||||
WSF_ROUTED_SERVICE -- Inherit "routed" behavior
|
||||
WSF_URI_HELPER_FOR_ROUTED_SERVICE -- Help with URI mapping
|
||||
WSF_URI_TEMPLATE_HELPER_FOR_ROUTED_SERVICE -- Help with URI-template
|
||||
|
||||
feature -- Initialization
|
||||
initialize
|
||||
do
|
||||
Precursor
|
||||
initialize_router
|
||||
end
|
||||
|
||||
setup_router
|
||||
do
|
||||
map_uri ("/contact", contact_handler)
|
||||
|
||||
map_uri_template_with_request_methods (
|
||||
"/page/{title}", page_handler, router.methods_get
|
||||
)
|
||||
map_uri_template_with_request_methods (
|
||||
"/page/{title}", post_page_handler, router.methods_post
|
||||
)
|
||||
end
|
||||
</code></pre>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Router handler for pages</h2>
|
||||
<pre><code data-trim contenteditable class="eiffel">class PAGE_HANDLER
|
||||
inherit
|
||||
WSF_URI_TEMPLATE_HANDLER
|
||||
|
||||
feature -- Execution
|
||||
|
||||
execute (req: WSF_REQUEST; res: WSF_RESPONSE)
|
||||
do
|
||||
if attached {WSF_STRING} req.path_parameter ("title") as l_title then
|
||||
...
|
||||
</code></pre>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2>Thank you for watching</h2>
|
||||
<ul>
|
||||
<li>https://github.com/EiffelWebFramework/EWF/</li>
|
||||
<li>https://eiffel.org/</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section>
|
||||
<section>
|
||||
<p>Select theme</p>
|
||||
<ul>
|
||||
<li><a href="#" onclick="document.getElementById('theme').setAttribute('href','../res/theme/eiffel/eiffel.css'); return false;">eiffel.org</a> </li>
|
||||
<li><a href="#" onclick="document.getElementById('theme').setAttribute('href','../res/theme/ewf/ewf.css'); return false;">EWF</a></li>
|
||||
</ul>
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="../res/reveal.js/lib/js/head.min.js"></script>
|
||||
<script type="text/javascript" src="../res/reveal.js/js/reveal.min.js"></script>
|
||||
<script type="text/javascript" src="../res/reveal.js/plugin/highlight/highlight.js"></script>
|
||||
<script type="text/javascript" src="../res/reveal.js/plugin/zoom-js/zoom.js"></script>
|
||||
<!-- for now, local eiffel support for highlightjs -->
|
||||
<script type="text/javascript" src="../res/js/hljs_eiffel.js"></script>
|
||||
|
||||
<script>
|
||||
// Full list of configuration options available here:
|
||||
// https://github.com/hakimel/reveal.js#configuration
|
||||
|
||||
Reveal.initialize({
|
||||
controls: true,
|
||||
progress: true,
|
||||
minScale: 0.2,
|
||||
maxScale: 1.1,
|
||||
center: false,
|
||||
transition: 'linear', // none/linear/fade/slide/convex/concave/zoom
|
||||
//slideNumber: false,
|
||||
//overview: true,
|
||||
history: true,
|
||||
|
||||
// transitionSpeed: 'slow',
|
||||
// backgroundTransition: 'slide',
|
||||
|
||||
// Optional reveal.js plugins
|
||||
dependencies: [
|
||||
{ src: '../res/reveal.js/plugin/highlight/highlight.js',
|
||||
async: true,
|
||||
condition: function() { return !!document.querySelector( 'pre code' ); },
|
||||
callback: function() {
|
||||
hljs.initHighlightingOnLoad();
|
||||
initHighlightingForEiffel(hljs);
|
||||
}
|
||||
},
|
||||
{ src: '../res/reveal.js/plugin/notes/notes.js',
|
||||
async: true
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
91
tutorial/EWF/index.html
Normal file
91
tutorial/EWF/index.html
Normal file
@@ -0,0 +1,91 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
|
||||
<title>Eiffel Web Framework: basic service</title>
|
||||
<meta name="description" content="List of slides related to EWF ">
|
||||
<meta name="author" content="Jocelyn Fiat">
|
||||
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui">
|
||||
|
||||
<link rel="stylesheet" href="../res/reveal.js/css/reveal.min.css">
|
||||
<link rel="stylesheet" href="../res/theme/ewf/ewf.css" id="theme">
|
||||
<!--
|
||||
<link rel="stylesheet" href="../res/theme/eiffel/eiffel.css" id="theme">
|
||||
<link rel="stylesheet" href="../res/reveal.js/css/theme/black.css" id="theme">
|
||||
-->
|
||||
<!-- Code syntax highlighting -->
|
||||
<link rel="stylesheet" href="../res/reveal.js/lib/css/zenburn.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="reveal">
|
||||
<div class="slides">
|
||||
<section class="full">
|
||||
<h2><span class="logo"></span>Eiffel Web Framework</h2>
|
||||
<br/>
|
||||
<h4>Tutorials</h4>
|
||||
<ul>
|
||||
<li><a href="0-basic-service.html">Create basic web application with EWF</a></li>
|
||||
<li><a href="1-url-dispatching.html">Using EWF router to dispatch URL</a></li>
|
||||
</ul>
|
||||
<div class="footer">©2015 <a href="https://eiffel.org">eiffel.org</a></div>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Visit EWF project</h2>
|
||||
<br/>
|
||||
<ul>
|
||||
<li>https://github.com/EiffelWebFramework/EWF/</li>
|
||||
</ul>
|
||||
</section>
|
||||
<section>
|
||||
<section>
|
||||
<h2>Settings ..</h2>
|
||||
one more step
|
||||
</section>
|
||||
<section>
|
||||
<h2>Themes ..</h2>
|
||||
<li><a href="#" onclick="document.getElementById('theme').setAttribute('href','../res/theme/eiffel/eiffel.css'); return false;">eiffel.org</a></li>
|
||||
<li><a href="#" onclick="document.getElementById('theme').setAttribute('href','../res/theme/ewf/ewf.css'); return false;">EWF</a></li>
|
||||
</section>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Have a nice day ..</h2>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="../res/reveal.js/lib/js/head.min.js"></script>
|
||||
<script type="text/javascript" src="../res/reveal.js/js/reveal.min.js"></script>
|
||||
<script type="text/javascript" src="../res/reveal.js/plugin/highlight/highlight.js"></script>
|
||||
<script type="text/javascript" src="../res/reveal.js/plugin/zoom-js/zoom.js"></script>
|
||||
<script>
|
||||
// Full list of configuration options available here:
|
||||
// https://github.com/hakimel/reveal.js#configuration
|
||||
Reveal.initialize({
|
||||
controls: true,
|
||||
progress: true,
|
||||
minScale: 0.2,
|
||||
maxScale: 1.1,
|
||||
center: false,
|
||||
transition: 'linear', // none/linear/fade/slide/convex/concave/zoom
|
||||
//slideNumber: false,
|
||||
//overview: true,
|
||||
history: true,
|
||||
|
||||
// transitionSpeed: 'slow',
|
||||
// backgroundTransition: 'slide',
|
||||
|
||||
// Optional reveal.js plugins
|
||||
dependencies: [
|
||||
{ src: '../res/reveal.js/plugin/highlight/highlight.js', async: true, condition: function() { return !!document.querySelector( 'pre code' ); }, callback: function() { hljs.initHighlightingOnLoad(); } },
|
||||
{ src: '../res/reveal.js/plugin/notes/notes.js', async: true }
|
||||
]
|
||||
});
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user