-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Creating Web Apps #4
Labels
discussion
Ideas open for discussion
Comments
The route matching could be simplified from: Type.matchOn(model[Browser.routeKey], {
'/': () => el([], text`Welcome`),
'/with-params': ({ greeting }) => el([], text`${greeting}`),
}), to: Browser.router(model, {
'/': () => ...,
'/with-params': ({ greeting }) => ...,
}) |
How do route parameters work? Should it be defined in Browser.router(model, {
'/with-params/:greeting': ({ greeting }) => ...,
}) |
Given the changes in #3, the messages would look like: const Msg = Type.custom({
SetGreeting: [Type.string],
});
Input.button([], {
onPress: Maybe.just(Msg.SetGreeting('Bonjour')),
label: el([], text`Change greeting`),
}),
const update = (msg, model) => Msg.match(msg, {
SetGreeting: (greeting) => ({ greeting }),
}); |
And routing could be done like: const Routes = Type.custom({
Home: ['/'],
WithParam: ['/with-param', Type.string],
});
Browser.router(Routes, model, {
Home: () => {},
WithParam: (greeting) => {},
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Creating Web Apps
Following on from #2, the
wool/browser
package provide programs for creating websites and applications.It uses the same underlying
wool/ui
package aswool/terminal
andwool/native
to describe the layout of its elements.Programs
All these programs allow the website / app to be built into the html, css and javascript artifacts.
wool/browser
is a disappearing framework in a similar vein to Svelte. When compiled, the framework code that is required is embedded into your app and the rest is ditched.It is a functional library, with a single store of state at the root and declarative view functions that describe how that state is presented.
Sandbox
A sandbox application can not communicate with the outside world but can react to user input.
Messages
Events are declaratively added to interactions, such as pressing a button. The event is given a message that will be passed into the program's update function. This can then be used to update the model. The new model is then passed into the view function to create the new view.
Application
An application provides access to the document head and url. Though a routed application is probably more useful.
Routed Application
The routed application is a simplified application that handles routing for you. This is probably the ideal for most web apps.
It will populate your model with the updated route whenever it changes.
Possible implementation of
Browser.routedApplication
Questions
Extra programs?
This design borrows heavily from elm/browser, which provides two further programs:
element
anddocument
.The
element
program provides a way to embed an elm app within an existing webpage, which won't be needed with wool.The
document
program is the same as theapplication
but without the url routing. Is that useful? Or can users who want that just noop the url functions onapplication
?The text was updated successfully, but these errors were encountered: