Web without framework

Nov 7, 20160 likes141 views

This document provides feedback on a web application developed in Scala. It discusses using Scala and Akka for both the backend and frontend, with communication between them via websockets. The architecture proposed uses Scala.js to compile Scala code to JavaScript, allowing Actors implemented in Scala to manage the state of the user interface built with HTML, CSS, and JavaScript. Calling between Scala and JavaScript code is done through JSExport annotations. The benefits are a unified codebase and development paradigm across backend and frontend, while challenges include setting up the build and understanding JavaScript signatures when calling from Scala.

FEED BACK ON A WEB APPLICATION IN SCALA
28 october 2015 - Nicolas Jorand
{{ SOFTSHAKE }}

TEAM
• Software developper started with Java and then evolve to Scala
• Currently working on reactive solution using Akka.
• Some Knowledge of HTML, CSS and JavaScript
Well 2 guys !

PROJECT
• Perform data cleansing on csv ﬁle received by customers.
• Not technical user
• Get all the rules from the users to eventually process automatically
the ﬁles.
• Development time boxed to 20 days

USER INTERFACE ?
• Input is CSV
• Data manipulation evolving constantly
• Output is CSV
WHAT DO WE REALLY NEED ?
• Use Excel as UI
Never ﬁts the needs
Learning curve / Dev time
HTMLTable
DSL / Ace
HTMLTable
How to industrialise
• Existing mapping tool
• Framework (goJS, jointJS )

UI WEB FRAMEWORK ?
Evaluate,
Read forums
Do some tests
Got it !
Learning curve
6 month later…
StackOverﬂow Inﬁnite Loop

DEV, NOT DESIGNER
• How to get it responsive !!
• Use a nice template (SmartAdmin)
• How to integrate with web framework

WHAT I WOULD LIKE
• Take the template and code the functionalities
• Use only one language for back and front
• User actions are events, just use the Actor Model.
• Need a state at the UI level, the Finite State Machine (FSM)

ARCHITECTURE
SmartAdmin
Browser
Ace Akka.js
uPickle
Scala.js
Akka
uPickle
Scala.js
Web Server
Akka
Files Processing
Apache Commons CSV
Asynchronous
Blocking
JSON
Akka messages

CALL SCALA FROM JS
$(document).ready(function () { 
pageSetUp(); 
io.xtech.ui.client.FichierIntl().init(); 
})
@JSExport("io.xtech.ui.client.FichierIntl") 
object FichierIntl { 
 
val webSocket = new WebSocket(getWebsocketUri(dom.document)) 
 
val system = ActorSystem("fichierIntl-ui") 
val fsm = system.actorOf(UIManagerActor.props(new ModalComponent())) 
@JSExport 
def init(): Unit = { 
val socket = getWebSocket 
fsm ! UIInitialize(socket) 
} 
 
def getWebSocket: WebSocket = { 
webSocket.onmessage = { (event: MessageEvent) => 
val msg = read[userEvent](event.data.toString) 
msg match { 
case Stats(data) => 
fsm ! UIStats(data) 
 
case DSLStatement(ast) => 
fsm ! UINewDSL(ast) 
 
case Customers(cust) => 
fsm ! UICustomerList(cust) 
} 
 
webSocket.onclose = { (event: CloseEvent) ⇒ 
fsm ! UIResetToPageNotInitialized 
jQuery("#closedConnectionModal").modal("show") 
} 
webSocket 
}
class UIManagerActor(modal: ModalComponent) extends Actor with FSM[UIState, UIData] { 
 
def common: StateFunction = { 
// common code for all states 
case Event(msg@UICustomerList(cust), data) => 
logReceived(msg) 
modal.buildModalCustomerSelection(cust, data.socket.get) 
modal.buildModalFilesSelection(List.empty, data.socket.get) 
stay()
}

CALL JS FROM SCALA
function myFunction() { 
console.log(“Hello from Javascript”); 
}
@js.native 
object MyCode extends js.Object { 
def myFunction(): Unit = js.native 
}
def foo {
MyCode.myFunction()
}

PRO / CONS
• Code Isomorphe
• Same paradigm
• Type Safe
• Team Building
• Setup (No pattern)
• Create UI components
• Debug Actor on client
• Understand JS signature

AngularJS is a framework for client-side dynamic web apps. It lets you use HTML as your template language and lets you extend HTML's syntax to express your application's components clearly and succinctly. Angular's low impact nature ties in with Drupal's data handling and structure to allow you rapidly make interactive Javascript applications. Javascript developers will find that Angular's Controller/View structure adapts itself well to Drupal's Block and/or Panel System with minimal disruption to a standard Javascript development workflow - even if that developer has minimal or no Drupal knowledge. In this talk I'll cover setting up AngularJS in Drupal using the Angles module, how to setup your Angular project structure for a large implementation (it works for small ones too), interacting with Drupal via the Services module and gotchas to watch out for. This talk is targeted at technical users primarily but managers evaluating using AngularJS with Drupal will also benefit. Having some Javascript experience is recommended but not required.

AJAX the WordPress wayJustin Foell

This document discusses how to use AJAX in WordPress. It explains that AJAX allows asynchronous retrieval of data from a server without reloading the entire page. It describes how AJAX works in WordPress by making a jQuery call that is routed by WordPress and processed by a theme, plugin, or core function that returns HTML or JSON. It outlines the necessary components, including JavaScript/jQuery, a WordPress hook, and a function to handle the request and return data. Finally, it provides details on implementing AJAX calls in both the front-end and admin areas of WordPress.

Drupal & AngularJS - DrupalCamp Spain 2014Juampy NR

This document discusses decoupling Drupal from AngularJS by moving business logic from Drupal to the client using JavaScript. It provides reasons for decoupling, including that theming in Drupal can be tedious and tricky, it serves as an alternative to Edge Side Includes (ESI) delivered by reverse proxies, and it allows for easier Drupal core upgrades. Key aspects of AngularJS like directives, controllers, and two-way data binding are demonstrated. AngularJS is presented as a good option for decoupling due to its model-view-controller separation and built-in data binding, unlike jQuery and Backbone which lack these features.

Ajax basicsVel004

This document provides an introduction to AJAX and discusses its key concepts. It begins with an overview of rich user experiences on the web and introduces AJAX as a technology that enables rich internet applications. The document then covers real-world examples of AJAX, the technologies used in AJAX like XMLHttpRequest, and how AJAX provides asynchronous communication. It demonstrates the anatomy of an AJAX interaction using a data validation sample application. Finally, it discusses the XMLHttpRequest methods and properties used in AJAX as well as how AJAX interacts with the DOM and uses innerHTML to update pages.

Ajax technologySafal Agrawal

End to-end W3C - JS.everywhere(2012) EuropeAlexandre Morgaut

This document discusses end-to-end web standards and server-side JavaScript. It summarizes the World Wide Web Consortium (W3C) and its role in developing web standards. It also discusses how many W3C APIs can be used on both the client-side and server-side through JavaScript implementations like Node.js, RingoJS, and Wakanda. CommonJS standards allow modules and packages to be shared between client-side and server-side JavaScript.

angular-wakanda ngParis meetup 15 at 42Alexandre Morgaut

Presentation of Web Applications development possibilities with Angular-Wakanda and an overview of its API usages not only to reach the WakandaDB databut also any kind of third party data sources. We'll see: - the creation of a NoSQL Object business Model adapted for the Web platform; - an integration in the Yeoman workflow; - dynamic JSON document controlled by the angular client; - with relationships between these server JS objects - and access to their server JS methods - an overview of SSJS multi-threading with mixte HTML5 / node.js APIs - notifications by Web Sockets

React IntroductionQuang Bửu Lê

React is a JavaScript library for building user interfaces that uses a component-based approach. It uses a virtual DOM for fast re-rendering that only updates the real DOM with the changes between renders. Components should be kept small and contain only display logic, with data changes handled through one-way reactive data flow that triggers re-renders when the state changes. The virtual DOM allows efficient re-rendering by diffing against the previous render and only applying the differences to the real DOM.

Write Powerful Javascript Modules To Make Your Apps DRY (Brian Leathem)Red Hat Developers

Large-scale Javascript applications benefit from a modular approach that let code be reused both within the application and across repeated implementations. In this session, we'll look at the modular approach used to build reusable Javascript modules in the Red Hat mobile field workforce management application (WFM) showcased in this year's Summit middleware keynote demo. Reusable modules for WFM are packaged as node package manager (npm) modules, providing a consistent format for both server and client sides using Node.js and Browserify. Modules are loosely coupled using the Mediator pattern and they broadcast user actions and state changes giving the application and other modules the opportunity to hook into those events. Additionally, visual components are packaged in a framework-agnostic manner, providing reusable UI components. You'll leave this session understanding the challenges faced when building reusable modules for large-scale applications, and the solutions employed in building out the reusable WFM modules.

Michael North "Ember.js 2 - Future-friendly ambitious apps, that scale!"Fwdays

Ember.js is being adopted more and more broadly as time passes, and is an excellent choice for highly complex data-driven UIs. With the recent release of the "2.0" version of the framework, things are faster, smarter, and easier than ever. With a focus on productivity and reducing the number of trivial decisions developers must make while building an app, it's astonishing how quickly one can get up and running, and how well the abstractions hold up as the codebase scales in size and complexity. I'd like to give a general overview of Ember, and pause to reflect on some important differences that may be important when considering what the best tool is for your project.

Ajax and RJSDominiek ter Heide

Introduction to AJAXAbzetdin Adamov

This document provides an introduction to AJAX (Asynchronous JavaScript and XML) technologies. It defines AJAX as using JavaScript asynchronously behind the scenes to load additional data without reloading the entire web page. Benefits of AJAX include a rich user interface experience and efficient loading of dynamic data. The document outlines how to use the XMLHttpRequest object to make asynchronous requests for data from the server. Examples and demos of AJAX applications are also referenced.

001. Introduction about ReactBinh Quan Duc

This document provides an introduction to ReactJS, including: - ReactJS was developed by Facebook in 2013 and is currently at version 15.3.2; it is a view library rather than a framework - Reasons for choosing ReactJS include faster websites, reusable views, a large community, ease of writing tests, and integration with other frameworks - The document discusses Webpack, JSX, ES6 features, and Redux, which are important technologies to learn when using ReactJS

From Web App Model Design to Production with WakandaAlexandre Morgaut

There is many interesting platforms out there to develop Web applications, like .NET, Spring, ruby on rails, Django, LAMP, Meteor, and so on. In this presentation, you will discover Wakanda a Model driven NoSQL / SSJS platform built on Web standards. You will see how a project starts, can be designed, tested, developed by a team, debugged, administrated, maintained, and then how to update it in the future. We will compare to some existing platforms and why Wakanda could make you more efficient.

JavaScript para Graficos y Visualizacion de Datosphilogb

This document discusses using JavaScript for data visualization and graphics. It presents examples of collecting video data using HTML5 APIs, transforming the data with Web Workers and typed arrays, rendering 3D scenes with WebGL and PhiloGL, and interacting with forms. The examples show loading weather data and manipulating it to render an interactive 3D histogram in the browser. The document argues that using modern HTML5 APIs and lightweight frameworks directly provides more power and control than monolithic application frameworks.

React.js - and how it changed our thinking about UIMarcin Grzywaczewski

This document discusses React.js and how it changed the author's thinking about building user interfaces (UI). It describes how developing UI was previously slow, error-prone, and not fun using Handlebars templates, jQuery DOM manipulation, and redrawing on every change. React.js introduced a declarative and component-based approach that is faster, less error-prone, and more enjoyable. Components have properties (props) and state, re-render only when needed for performance, and can be reused and remain independent. This new approach to UI development freed the author to focus more on experimentation rather than fighting the framework.

"Spring Boot. Boot up your development" Сергей МоренецFwdays

своем докладе я подробно расскажу о Spring Boot - библиотеке, которая значительно упрощает работу разработчика и уменьшает количество написанного кода. Spring Boot позволяет быстрее и проще сконфигурировать сторонние библиотеки и фреймворки, а также предоставляет удобные сервисы для получения метрик работы приложения. Я поделюсь своим опытом работы, интеграции с Maven/Gradle, покажу практические примеры использования этой технологии. После этого доклада вы можете самостоятельно использовать Spring Boot в своих приложениях.

C# Async/Await ExplainedJeremy Likness

The document discusses asynchronous programming with async and await in C#. It explains that async and await were introduced to address issues with threading like overhead and blocking. Async methods use threads efficiently from the thread pool rather than creating new threads. Await yields threads rather than blocking them. The document demonstrates async programming and best practices like using Task instead of async void. It recommends using async for I/O bound work since it can improve performance over synchronous code.

Intro to Backbone.js with RailsTim Tyrrell

Ruby on Rails is awesome…why should you care about Backbone.js? Tim will give an overview of why Rails developers should care about Javascript MVC frameworks and how you can easily integrate one into a Rails application. He’ll also will explain the structure of a Backbone.js application and how the paradigm jives with its Rails counterparts. You should be able to walk away from this presentation and add Backbone.js to your resume. Code here: https://github.com/timtyrrell/todo

A Dynamic Analysis Framework for Front-end JavaScriptLiang Gong

A dynamic analysis framework for front-end JavaScript. It allows you to plug in your analysis code to analyse JavaScript code running in any real-world websites. This framework is programmable and extensible. Like Pin, Valgrind, Dynamorio for C\C++, Jalangi Firefox extension instrument JavaScript code in webpage to facilitate different kinds of program analysis, for example, profiling, taint analysis, object allocation tracking, finding bugs, detecting performance issues, or even heavy weight analysis like symbolic execution or concolic execution. Please check out our project website: https://www.eecs.berkeley.edu/~gongliang13/jalangi_ff/

Intoduction to AjaxRISHAV ANURAG

AJAX is a group of web development techniques using many web technologies like HTML, CSS, DOM, JSON or XML, and JavaScript together to create asynchronous web applications. It allows updating parts of a web page without reloading the entire page. AJAX development began in the 1990s and was renamed by Jesse James Garret in 2005 after technologies like XMLHttpRequest were introduced. AJAX provides benefits like more interactivity, faster websites, and reduced server traffic by allowing JavaScript processing on the client-side. Some disadvantages are browser compatibility issues and problems with reloading and backward navigation.

AjaxVenkat Krishnan

The document discusses Ajax, which uses a combination of technologies like XHTML, CSS, JavaScript, and XMLHttpRequest to retrieve data asynchronously from web servers without reloading the entire webpage. It allows web applications to be more interactive and responsive by exchanging small amounts of data with the server behind the scenes. While not new, Ajax became popular when Google used it to great effect in Gmail, showing how it could enhance the usability of web applications and create richer internet experiences without the need for plugins like Flash.

The Chaos Tools Suitemerlinofchaos

The Chaos Tools Suite provides a collection of API tools for building forms, handling AJAX interactions, and managing CSS in Drupal. It includes form wizards to create multi-step forms, an AJAX framework using a macro language to handle returned data, modals that build on the AJAX system, and tools for collapsible DIVs and sanitizing CSS. While not part of Drupal core, it is considered sub-core and provides important utilities used by modules like Views and Panels.

Mvc razor and working with dataVladislav Hadzhiyski

This document discusses Razor code expressions and blocks in ASP.NET MVC and working with data using Entity Framework. It describes the Entity Framework architecture and the two main approaches of Database-First and Code-First. Database-First uses a designer, allows more SQL, and has better data performance, while Code-First does not use a designer, requires almost no SQL, allows faster development, and makes building complex data models easier. The document also provides homework on implementing CRUD operations for categories and notes models and includes resources for further information.

Advantages of Rails FrameworkSathish Mariappan

This document discusses the advantages of using Ruby on Rails for web development. It highlights that Rails allows for fast, agile development with features like scaffolding, DRY principles, and AJAX. Rails also emphasizes readable, well-tested code and follows the MVC framework. MVC separates the interface to the database (model), business logic, and the user interface (view). Rails makes it easy to link models and views through controllers and features like polymorphism, caching, and RESTful routes are discussed. Test-driven development is also highlighted as an important practice in Rails.

AjaxSiya Agarwal

AJAX is a technique for creating faster and more interactive web pages through the use of JavaScript, XML, and HTML. It allows for asynchronous data exchange in the background without reloading the entire web page. This improves interactivity, makes pages more responsive, and increases perceived performance. Common AJAX techniques include retrieving small amounts of data from the server on user actions to dynamically update parts of the page rather than reloading the whole page.

Web forms Overview PresentationVladislav Hadzhiyski

This document provides an overview of ASP.NET Web Forms, including its architecture, types of web applications it can create, its page lifecycle, and common controls. ASP.NET Web Forms uses a code-behind model and page lifecycle to handle requests and render HTML server-side. It supports a variety of controls like buttons, textboxes, labels and images to build web forms and handle user input on the server. The page lifecycle consists of several stages from request to rendering, including initialization, loading, handling postback events, and unloading.

Introduction presentationVladislav Hadzhiyski

This document outlines a course on web application development using ASP.NET and AJAX. The 10-part course covers topics such as server controls, data handling, security, localization, XML web services, MVC, Razor, data sources, and AJAX and security in ASP.NET MVC. It also lists potential exam tasks such as building a forum, blog, photo album, or school management application. The document is presented by Vladislav Hadzhiyski and includes his contact information.

How to make Ajax Libraries work for youSimon Willison

Moving to the Client - JavaFX and HTML5Stephen Chin

Stephen Chin presented on moving applications to the client using JavaFX and HTML5. He provided a history of HTML and discussed key HTML5 features like Canvas, offline storage, and WebSockets. He demonstrated displaying HTML in JavaFX using the WebView control and calling JavaScript from JavaFX. Chin also showed responsive design techniques and discussed using JavaScript frameworks like jQuery for cross-browser compatibility. Finally, he highlighted Oracle Cloud Platform services for running databases and Java applications in the cloud.

More Related Content

What's hot (20)

Write Powerful Javascript Modules To Make Your Apps DRY (Brian Leathem)Red Hat Developers

Michael North "Ember.js 2 - Future-friendly ambitious apps, that scale!"Fwdays

Ajax and RJSDominiek ter Heide

Introduction to AJAXAbzetdin Adamov

001. Introduction about ReactBinh Quan Duc

From Web App Model Design to Production with WakandaAlexandre Morgaut

JavaScript para Graficos y Visualizacion de Datosphilogb

React.js - and how it changed our thinking about UIMarcin Grzywaczewski

"Spring Boot. Boot up your development" Сергей МоренецFwdays

C# Async/Await ExplainedJeremy Likness

Intro to Backbone.js with RailsTim Tyrrell

A Dynamic Analysis Framework for Front-end JavaScriptLiang Gong

Intoduction to AjaxRISHAV ANURAG

AjaxVenkat Krishnan

The Chaos Tools Suitemerlinofchaos

Mvc razor and working with dataVladislav Hadzhiyski

Advantages of Rails FrameworkSathish Mariappan

AjaxSiya Agarwal

Web forms Overview PresentationVladislav Hadzhiyski

Introduction presentationVladislav Hadzhiyski

Write Powerful Javascript Modules To Make Your Apps DRY (Brian Leathem)Red Hat Developers

Michael North "Ember.js 2 - Future-friendly ambitious apps, that scale!"Fwdays

Ajax and RJSDominiek ter Heide

Introduction to AJAXAbzetdin Adamov

001. Introduction about ReactBinh Quan Duc

From Web App Model Design to Production with WakandaAlexandre Morgaut

JavaScript para Graficos y Visualizacion de Datosphilogb

React.js - and how it changed our thinking about UIMarcin Grzywaczewski

"Spring Boot. Boot up your development" Сергей МоренецFwdays

C# Async/Await ExplainedJeremy Likness

Intro to Backbone.js with RailsTim Tyrrell

A Dynamic Analysis Framework for Front-end JavaScriptLiang Gong

Intoduction to AjaxRISHAV ANURAG

AjaxVenkat Krishnan

The Chaos Tools Suitemerlinofchaos

Mvc razor and working with dataVladislav Hadzhiyski

Advantages of Rails FrameworkSathish Mariappan

AjaxSiya Agarwal

Web forms Overview PresentationVladislav Hadzhiyski

Introduction presentationVladislav Hadzhiyski

Similar to Web without framework (20)

How to make Ajax Libraries work for youSimon Willison

Moving to the Client - JavaFX and HTML5Stephen Chin

Building intranet applications with ASP.NET AJAX and jQueryAlek Davis

Developing High Performance Web Apps - CodeMash 2011Timothy Fisher

This document provides an overview of techniques for developing high performance web applications. It discusses why front-end performance matters, and outlines best practices for optimizing page load times, using responsive interfaces, loading and executing JavaScript efficiently, and accessing data. The presentation recommends tools for monitoring and improving performance, such as Firebug, Page Speed, and YSlow.

Introduction to web application development with Vue (for absolute beginners)...Lucas Jellema

In this slide deck I show you how you can easily and quickly create quite rich web applications with Vue 3 – without having to study complex concepts or understand many technical details. I have only recently learned how to work with Vue 3 myself and now is the best time for me to share my learning experience (and my enthusiasm) with you. I know what I found essential to understand and what most got me excited in these early steps (what was a little bit hard to grasp). I believe that I can present my steps and guide you to experience the same fun and have a similarly gratifying experience. I am not an expert in this subject – I have barely learned how to walk and that is why I can help you with these first steps with Vue. In this deck, I do not explain how Vue works. I do not really know that. I will show you how to work with it and how to create web applications that are functional, appealing, fast and responsive. The approach I am taking is straightforward: • I will tell you a little bit about web development, browsers and reactive frameworks • I will show the hello world of Vue applications • I will explain about components and nesting, events, data binding and reactive behavior and demonstrate these concepts • I will introduce Vue UI Component libraries – and with no effort at all we will launch our application to the next level – with rich components to explore, manipulate, visualize data collections • We will publish the web application from our development environment to where the whole world could see it – using GitHub Pages • As bonus topic – we discuss state management At the end of this session you will be able to quickly create a simple yet rich web application with Vue 3. You have a starting point to further evolve your skills with the many online resources I am convinced that you will enjoy your newfound powers and the simplicity and power of Vue 3. Note: a tutorial accompanies this slide deck - see https://github.com/lucasjellema/code-face-vue3-intro-reactiive-webapps-aug2023/blob/main/README.md

Progressive Web Apps and ReactMike Melusky

The document discusses progressive web apps and React. It begins by introducing progressive web apps and their benefits over traditional web apps and native apps. It then covers prerequisites for building progressive web apps with React including HTML, JavaScript, Node.js and CLI knowledge. The document proceeds to discuss key React topics like components, virtual DOM, JSX, props and state. It also covers service workers, manifest files and tools for testing progressive web apps.

Building intranet applications with ASP.NET AJAX and jQueryAlek Davis

This document provides an overview of building intranet applications using ASP.NET AJAX and jQuery. It discusses the technologies used, including ASP.NET AJAX, jQuery, and rich internet applications. It also covers development topics such as common patterns, tools for debugging, and references for further learning. The presentation aims to provide an understanding of jQuery and ASP.NET AJAX and how to build applications using them.

JavaONE 2012 Using Java with HTML5 and CSS3Helder da Rocha

The document discusses using Java with HTML5 and related technologies like CSS3 and WebSockets. It provides an overview of HTML5 features like Canvas, SVG, CSS3 animations, and WebSockets. It describes how these features can be used to build interactive client-side applications and how Java servers can integrate with HTML5 apps by saving/retrieving application state and graphics from the client. Java servers can generate graphics like SVG dynamically based on data from HTML5 clients.

qooxdoo - Open Source Ajax Frameworkecker

qooxdoo is an open-source AJAX framework for building cross-browser web applications. It provides a comprehensive GUI toolkit and tools to build desktop-like rich internet applications. The framework uses object-oriented JavaScript and a build process to package applications for deployment. It aims to support developers through features like debugging, internationalization and IDE integration. The project is open source and maintained by a team of full-time developers.

(2018) Webpack Encore - Asset Management for the rest of usStefan Adolf

Webpack is the fundamental building block of all modern Javascript application frameworks. While being flexible and powerful its plain configuration can be quite hard to understand if you just want things to "work like expected". Symfony's opinionated webpack wrapper "Encore" allows you to setup a flexible asset pipeline with 20 lines of code. This talk and its supporting git repo shows some of the concepts and ends up with a fully working Symfony 4.1 application utilizing a combined React, Vue.js and jQuery (sic) frontend. https://github.com/elmariachi111/encore-demo

Rob Tweed :: Ajax and the Impact on Caché and Similar Technologiesgeorge.james

Ajax presents a new way of developing web applications that is more event-driven like typical client-server GUI applications. While Ajax uses technologies like JavaScript, XML, and CSS to asynchronously update parts of a page without reloading, the role of backends like Caché is reduced to basic data storage and retrieval. However, Caché remains well-suited for large, high-performance enterprise applications as they grow beyond what technologies like MySQL can easily support. Frameworks like EWD that define applications independently of technologies allow easier migration between backends like MySQL and Caché as applications scale.

Moving to the Client - JavaFX and HTML5Stephen Chin

Stephen Chin and Kevin Nilson presented on integrating JavaFX and HTML5. They discussed the history of HTML and HTML5 features like offline storage and WebGL. They demonstrated displaying HTML in JavaFX using WebView and responding to browser events. They also showed examples in different JVM languages like GroovyFX and ScalaFX. A Pro JavaFX 2 book was announced to cover the new controls and integration examples.

Apex Code Analysis Using the Tooling API and CanvasSalesforce Developers

The Tooling API provides powerful new ways to manage your code. It can help you measure code health, find circular dependencies, and identify code that's no longer in use. Join us to learn how to use the Tooling API to conduct a quality analysis of your code, and how to do this using an app integrated via Force.com Canvas -- no command line or desktop install required! Take your Apex knowledge to the next level.

Introduction to JQuery, ASP.NET MVC and SilverlightPeter Gfader

This document provides an overview of a presentation on jQuery, ASP.NET MVC, and Silverlight. It discusses jQuery being a lightweight JavaScript library that makes web development simpler. ASP.NET MVC is presented as an alternative to WebForms that separates concerns into models, views, and controllers. Silverlight is introduced as a technology for building rich interactive applications for the web using .NET.

Google Web ToolkitSoftware Park Thailand

Intro to node.js - Ran Mizrahi (28/8/14)Ran Mizrahi

This document provides an introduction to Node.js, including what it is, how it works, and some common frameworks and tools used with Node.js. Node.js is a JavaScript runtime built on Chrome's V8 JavaScript engine that uses an event-driven, non-blocking I/O model to handle requests. It allows for easy development of scalable network applications. The document discusses Node.js' event loop architecture, non-blocking I/O, and provides examples of using Express, Socket.IO, Mongoose and testing with Mocha/Chai.

Intro to node.js - Ran Mizrahi (27/8/2014)Ran Mizrahi

Node.js is a platform built on Chrome V8 javascript runtime engine for building fast and scalable, non-blocking, real-time and network applications. In this session Ran will introduce node.js and how to develop large code bases using it. He'll cover the following aspects: • What is node.js? • Apache vs. Nginx performance (One thread per connection vs. event loop) and what it has to do with node.js. • Why node was written in Javascript? • Main tools and frameworks (Express, socket.io, mongoose etc.) • TDD/BDD with node.js using mocha and Chai. Ran Mizrahi, Founder of CoCycles, Passionate entrepreneur and software engineer who loves to continuously innovate and deliver meaningful products while having true fun with the right team.

Beyond HTML: Tools for Building Web 2.0 AppsMarcos Caceres

Intro JavaScriptkoppenolski

SynapseIndia asp.net2.0 ajax DevelopmentSynapseindiappsdevelopment

How to make Ajax Libraries work for youSimon Willison

Moving to the Client - JavaFX and HTML5Stephen Chin

Building intranet applications with ASP.NET AJAX and jQueryAlek Davis

Developing High Performance Web Apps - CodeMash 2011Timothy Fisher

Introduction to web application development with Vue (for absolute beginners)...Lucas Jellema

Progressive Web Apps and ReactMike Melusky

Building intranet applications with ASP.NET AJAX and jQueryAlek Davis

JavaONE 2012 Using Java with HTML5 and CSS3Helder da Rocha

qooxdoo - Open Source Ajax Frameworkecker

(2018) Webpack Encore - Asset Management for the rest of usStefan Adolf

Rob Tweed :: Ajax and the Impact on Caché and Similar Technologiesgeorge.james

Moving to the Client - JavaFX and HTML5Stephen Chin

Apex Code Analysis Using the Tooling API and CanvasSalesforce Developers

Introduction to JQuery, ASP.NET MVC and SilverlightPeter Gfader

Google Web ToolkitSoftware Park Thailand

Intro to node.js - Ran Mizrahi (28/8/14)Ran Mizrahi

Intro to node.js - Ran Mizrahi (27/8/2014)Ran Mizrahi

Beyond HTML: Tools for Building Web 2.0 AppsMarcos Caceres

Intro JavaScriptkoppenolski

SynapseIndia asp.net2.0 ajax DevelopmentSynapseindiappsdevelopment

Recently uploaded (20)

Why Orangescrum Is a Game Changer for Construction Companies in 2025Orangescrum

Get & Download Wondershare Filmora Crack Latest [2025]saniaaftab72555

Copy & Past Link 👉👉 https://dr-up-community.info/ Wondershare Filmora is a video editing software and app designed for both beginners and experienced users. It's known for its user-friendly interface, drag-and-drop functionality, and a wide range of tools and features for creating and editing videos. Filmora is available on Windows, macOS, iOS (iPhone/iPad), and Android platforms.

Creating Automated Tests with AI - Cory House - Applitools.pdfApplitools

Top 10 Client Portal Software Solutions for 2025.docxPortli

Avast Premium Security Crack FREE Latest Version 2025mu394968

🌍📱👉COPY LINK & PASTE ON GOOGLE https://dr-kain-geera.info/👈🌍 Avast Premium Security is a paid subscription service that provides comprehensive online security and privacy protection for multiple devices. It includes features like antivirus, firewall, ransomware protection, and website scanning, all designed to safeguard against a wide range of online threats, according to Avast. Key features of Avast Premium Security: Antivirus: Protects against viruses, malware, and other malicious software, according to Avast. Firewall: Controls network traffic and blocks unauthorized access to your devices, as noted by All About Cookies. Ransomware protection: Helps prevent ransomware attacks, which can encrypt your files and hold them hostage. Website scanning: Checks websites for malicious content before you visit them, according to Avast. Email Guardian: Scans your emails for suspicious attachments and phishing attempts. Multi-device protection: Covers up to 10 devices, including Windows, Mac, Android, and iOS, as stated by 2GO Software. Privacy features: Helps protect your personal data and online privacy. In essence, Avast Premium Security provides a robust suite of tools to keep your devices and online activity safe and secure, according to Avast.

Mastering Fluent Bit: Ultimate Guide to Integrating Telemetry Pipelines with ...Eric D. Schabell

It's time you stopped letting your telemetry data pressure your budgets and get in the way of solving issues with agility! No more I say! Take back control of your telemetry data as we guide you through the open source project Fluent Bit. Learn how to manage your telemetry data from source to destination using the pipeline phases covering collection, parsing, aggregation, transformation, and forwarding from any source to any destination. Buckle up for a fun ride as you learn by exploring how telemetry pipelines work, how to set up your first pipeline, and exploring several common use cases that Fluent Bit helps solve. All this backed by a self-paced, hands-on workshop that attendees can pursue at home after this session (https://o11y-workshops.gitlab.io/workshop-fluentbit).

Requirements in Engineering AI- Enabled Systems: Open Problems and Safe AI Sy...Lionel Briand

Best Practices for Collaborating with 3D Artists in Mobile Game DevelopmentJuego Studios

Cryptocurrency Exchange Script like Binance.pptxriyageorge2024

How can one start with crypto wallet development.pptxlaravinson24

Odoo ERP for Education Management to Streamline Your Education ProcessiVenture Team LLP

Full Cracked Resolume Arena Latest Versionjonesmichealj2

Expand your AI adoption with AgentExchangeFexle Services Pvt. Ltd.

AgentExchange is Salesforce’s latest innovation, expanding upon the foundation of AppExchange by offering a centralized marketplace for AI-powered digital labor. Designed for Agentblazers, developers, and Salesforce admins, this platform enables the rapid development and deployment of AI agents across industries. Email: [email protected] Phone: +1(630) 349 2411 Website: https://www.fexle.com/blogs/agentexchange-an-ultimate-guide-for-salesforce-consultants-businesses/?utm_source=slideshare&utm_medium=pptNg

Implementing promises with typescripts, step by stepRan Wahle

Tools of the Trade: Linux and SQL - Google CertificateVICTOR MAESTRE RAMIREZ

Secure Test Infrastructure: The Backbone of Trustworthy Software DevelopmentShubham Joshi

Proactive Vulnerability Detection in Source Code Using Graph Neural Networks:...Ranjan Baisak

As software complexity grows, traditional static analysis tools struggle to detect vulnerabilities with both precision and context—often triggering high false positive rates and developer fatigue. This article explores how Graph Neural Networks (GNNs), when applied to source code representations like Abstract Syntax Trees (ASTs), Control Flow Graphs (CFGs), and Data Flow Graphs (DFGs), can revolutionize vulnerability detection. We break down how GNNs model code semantics more effectively than flat token sequences, and how techniques like attention mechanisms, hybrid graph construction, and feedback loops significantly reduce false positives. With insights from real-world datasets and recent research, this guide shows how to build more reliable, proactive, and interpretable vulnerability detection systems using GNNs.

Microsoft AI Nonprofit Use Cases and Live Demo_2025.04.30.pdfTechSoup

In this webinar we will dive into the essentials of generative AI, address key AI concerns, and demonstrate how nonprofits can benefit from using Microsoft’s AI assistant, Copilot, to achieve their goals. This event series to help nonprofits obtain Copilot skills is made possible by generous support from Microsoft. What You’ll Learn in Part 2: Explore real-world nonprofit use cases and success stories. Participate in live demonstrations and a hands-on activity to see how you can use Microsoft 365 Copilot in your own work!

Top 10 Data Cleansing Tools for 2025.pdfAffinityCore

Innovative Approaches to Software Dev no good at allayeshakanwal75

Why Orangescrum Is a Game Changer for Construction Companies in 2025Orangescrum

Get & Download Wondershare Filmora Crack Latest [2025]saniaaftab72555

Creating Automated Tests with AI - Cory House - Applitools.pdfApplitools

Top 10 Client Portal Software Solutions for 2025.docxPortli

Avast Premium Security Crack FREE Latest Version 2025mu394968

Mastering Fluent Bit: Ultimate Guide to Integrating Telemetry Pipelines with ...Eric D. Schabell

Requirements in Engineering AI- Enabled Systems: Open Problems and Safe AI Sy...Lionel Briand

Best Practices for Collaborating with 3D Artists in Mobile Game DevelopmentJuego Studios

Cryptocurrency Exchange Script like Binance.pptxriyageorge2024

How can one start with crypto wallet development.pptxlaravinson24

Odoo ERP for Education Management to Streamline Your Education ProcessiVenture Team LLP

Full Cracked Resolume Arena Latest Versionjonesmichealj2

Expand your AI adoption with AgentExchangeFexle Services Pvt. Ltd.

Implementing promises with typescripts, step by stepRan Wahle

Tools of the Trade: Linux and SQL - Google CertificateVICTOR MAESTRE RAMIREZ

Secure Test Infrastructure: The Backbone of Trustworthy Software DevelopmentShubham Joshi

Proactive Vulnerability Detection in Source Code Using Graph Neural Networks:...Ranjan Baisak

Microsoft AI Nonprofit Use Cases and Live Demo_2025.04.30.pdfTechSoup

Top 10 Data Cleansing Tools for 2025.pdfAffinityCore

Innovative Approaches to Software Dev no good at allayeshakanwal75

Web without framework

1. FEED BACK ON A WEB APPLICATION IN SCALA 28 october 2015 - Nicolas Jorand {{ SOFTSHAKE }}

2. TEAM • Software developper started with Java and then evolve to Scala • Currently working on reactive solution using Akka. • Some Knowledge of HTML, CSS and JavaScript Well 2 guys !

3. PROJECT • Perform data cleansing on csv ﬁle received by customers. • Not technical user • Get all the rules from the users to eventually process automatically the ﬁles. • Development time boxed to 20 days

4. USER INTERFACE ? • Input is CSV • Data manipulation evolving constantly • Output is CSV WHAT DO WE REALLY NEED ? • Use Excel as UI Never ﬁts the needs Learning curve / Dev time HTMLTable DSL / Ace HTMLTable How to industrialise • Existing mapping tool • Framework (goJS, jointJS )

5. DEMO

6. UI WEB FRAMEWORK ? Evaluate, Read forums Do some tests Got it ! Learning curve 6 month later… StackOverﬂow Inﬁnite Loop

7. DEV, NOT DESIGNER • How to get it responsive !! • Use a nice template (SmartAdmin) • How to integrate with web framework

8. WHAT I WOULD LIKE • Take the template and code the functionalities • Use only one language for back and front • User actions are events, just use the Actor Model. • Need a state at the UI level, the Finite State Machine (FSM)

9. ARCHITECTURE SmartAdmin Browser Ace Akka.js uPickle Scala.js Akka uPickle Scala.js Web Server Akka Files Processing Apache Commons CSV Asynchronous Blocking JSON Akka messages

10. CALL SCALA FROM JS $(document).ready(function () {  pageSetUp();  io.xtech.ui.client.FichierIntl().init();  }) @JSExport("io.xtech.ui.client.FichierIntl")  object FichierIntl {    val webSocket = new WebSocket(getWebsocketUri(dom.document))    val system = ActorSystem("fichierIntl-ui")  val fsm = system.actorOf(UIManagerActor.props(new ModalComponent()))  @JSExport  def init(): Unit = {  val socket = getWebSocket  fsm ! UIInitialize(socket)  }    def getWebSocket: WebSocket = {  webSocket.onmessage = { (event: MessageEvent) =>  val msg = read[userEvent](event.data.toString)  msg match {  case Stats(data) =>  fsm ! UIStats(data)    case DSLStatement(ast) =>  fsm ! UINewDSL(ast)    case Customers(cust) =>  fsm ! UICustomerList(cust)  }    webSocket.onclose = { (event: CloseEvent) ⇒  fsm ! UIResetToPageNotInitialized  jQuery("#closedConnectionModal").modal("show")  }  webSocket  } class UIManagerActor(modal: ModalComponent) extends Actor with FSM[UIState, UIData] {    def common: StateFunction = {  // common code for all states  case Event(msg@UICustomerList(cust), data) =>  logReceived(msg)  modal.buildModalCustomerSelection(cust, data.socket.get)  modal.buildModalFilesSelection(List.empty, data.socket.get)  stay() }

11. CALL JS FROM SCALA function myFunction() {  console.log(“Hello from Javascript”);  } @js.native  object MyCode extends js.Object {  def myFunction(): Unit = js.native  } def foo { MyCode.myFunction() }

12. PRO / CONS • Code Isomorphe • Same paradigm • Type Safe • Team Building • Setup (No pattern) • Create UI components • Debug Actor on client • Understand JS signature

13. Questions ?

Web without framework

Recommended

More Related Content

What's hot (20)

Similar to Web without framework (20)

Recently uploaded (20)

Web without framework