phoenix-china / Bucklescript Phx
Licence: mit
BuckleScript binding for Phoenix Channel/Presence
Stars: ✭ 42
Programming Languages
ocaml
1615 projects
bucklescript
41 projects
Labels
Projects that are alternatives of or similar to Bucklescript Phx
game of life-elixir
An implementation of Conway's Game of Life in Elixir
Stars: ✭ 22 (-47.62%)
Mutual labels: phoenix-framework
React Phoenix
Make rendering React.js components in Phoenix easy
Stars: ✭ 426 (+914.29%)
Mutual labels: phoenix-framework
Fun with flags
Feature Flags/Toggles for Elixir
Stars: ✭ 554 (+1219.05%)
Mutual labels: phoenix-framework
WhatChat
A web chat application clone of Whatsapp web using Elixir / Phoenix, VueJs and PostgreSQL.
Stars: ✭ 32 (-23.81%)
Mutual labels: phoenix-framework
Hammer
An Elixir rate-limiter with pluggable backends
Stars: ✭ 366 (+771.43%)
Mutual labels: phoenix-framework
Matestack Ui Core
Matestack enables you to create sophisticated, reactive UIs in pure Ruby, without touching JavaScript and HTML. You end up writing 50% less code while increasing productivity, maintainability and developer happiness.
Stars: ✭ 469 (+1016.67%)
Mutual labels: phoenix-framework
curious messenger
Companion repository for Phoenix LiveView Messenger app by Curiosum.dev. Part 1: https://curiosum.dev/blog/elixir-phoenix-liveview-messenger-part-1?utm_source=github&utm_medium=social, Part 2: https://curiosum.dev/blog/elixir-phoenix-liveview-messenger-part-2?utm_source=github&utm_medium=social, Part 3: https://curiosum.dev/blog/elixir-phoenix-l…
Stars: ✭ 30 (-28.57%)
Mutual labels: phoenix-framework
Guardian auth
The Guardian Authentication Implementation Using Ecto/Postgresql Elixir Phoenix [ User Authentication ]
Stars: ✭ 15 (-64.29%)
Mutual labels: phoenix-framework
Phauxth
Authentication library for Phoenix, and other Plug-based, web applications
Stars: ✭ 418 (+895.24%)
Mutual labels: phoenix-framework
Phoenix Battleship
The Good Old game, built with Elixir, Phoenix, React and Redux
Stars: ✭ 503 (+1097.62%)
Mutual labels: phoenix-framework
Godello
Trello inspired kanban board made with the Godot Engine and GDScript, powered by an online real-time collaborative backend (Elixir and Phoenix Channels)
Stars: ✭ 273 (+550%)
Mutual labels: phoenix-framework
Cercle
Cercle is a CRM+Project Manager for your organization - Phoenix Framework & Vuejs
Stars: ✭ 284 (+576.19%)
Mutual labels: phoenix-framework
Remote retro
Free, world-class retrospectives
Stars: ✭ 474 (+1028.57%)
Mutual labels: phoenix-framework
phoenix bakery
Better compression for your Phoenix assets
Stars: ✭ 25 (-40.48%)
Mutual labels: phoenix-framework
Elixir Phoenix Realworld Example App
Exemplary real world application built with Elixir + Phoenix
Stars: ✭ 764 (+1719.05%)
Mutual labels: phoenix-framework
elixir
Companion Repo for the course: Elixir & Phoenix for Beginners
Stars: ✭ 40 (-4.76%)
Mutual labels: phoenix-framework
Canary
🐣 Elixir authorization and resource-loading library for Plug applications.
Stars: ✭ 450 (+971.43%)
Mutual labels: phoenix-framework
Phoenix routes js
Phoenix routes helpers in JavaScript code.
Stars: ✭ 17 (-59.52%)
Mutual labels: phoenix-framework
Awesome Phoenix
🔥 Collection of awesome open-source apps made with Phoenix Framework
Stars: ✭ 481 (+1045.24%)
Mutual labels: phoenix-framework
BuckleScript Phoenix
BuckleScript binding for Phoenix Channel/Presence to Phoenix's official JavaScript client.
This is usable now.
Feel free to create PRs.
- [X] Connect socket
- [X] Join channel
- [X] Push event
- [X] Handle event
- [X] Presence
- [ ] Support The Elm Architecture on BuckleScript (https://github.com/OvermindDL1/bucklescript-tea)
- [ ] Fallback support for polling.
To install
npm install -save bucklescript-phx
bsconfig.json
to make bsb
aware of this dependency
Please update your "bs-dependencies": [
"bucklescript-phx"
]
Notice:
-
Please add official Phoenix client as your dependency to make sure BuckleScript is able to require Phoenix's js.
-
Meta of Presence and payload of incoming event are decalred as
Js_json.t
which means you need to decode it with your prefered decoder (in TEA it is very convenient withJson.Decoder.decodeValue
). -
The bindings are based on https://github.com/DefinitelyTyped/DefinitelyTyped. There might be some error on mapping the types. Please help correct them if you find anything wrong. Thank you!
Here are the examples:
To join a channel:
open Phx
let handleReiceive event any =
match event with
| "ok" -> Js.log ("handleReiceive:" ^ event, "Joined")
| "error" -> Js.log ("handleReiceive:" ^ event, "Failed to join channel")
| _ -> Js.log ("handleReiceive:" ^ event, any)
let handleEvent event response =
let _ = Js.log ("handleEvent:" ^ event, response) in
()
let handleSyncState response =
let _ = Js.log ("handleSyncState", response) in
(*let _ = Js.log (Array.iter (fun key -> Js.log (Js_dict.unsafeGet response key)) (Js_dict.keys response) ) in*)
let _presences = Presence.syncState (Js.Dict.empty ()) response in
()
let handleSyncDiff diff =
let _ = Js.log ("handleSyncDiff:diff", diff) in
let presences = Presence.syncDiff (Js.Dict.empty ()) diff in
let _ = Js.log ("handleSyncDiff:presences", presences) in
()
let _ =
let socket = initSocket "/socket"
|> connectSocket
|> putOnClose (fun () -> Js.log "Socket closed") in
let channel = socket
|> initChannel "user:lobby" in
let _ = channel
|> putOn "from_server" (handleEvent "from:server")
|> putOnSyncState handleSyncState
|> putOnsyncDiff handleSyncDiff
|> joinChannel
|> putReceive "ok" (handleReiceive "ok")
|> putReceive "error" (handleReiceive "error") in
push "new:message" [%bs.obj { user = "Hello, Elixir! This is a greeting from BuckleScript!"} ] channel
Reasonml:
To join a channel:
open Phx
let handleReiceive = (event, any) =>
switch event {
| "ok" => Js.log(("handleReiceive:" ++ event, "Joined"))
| "error" => Js.log(("handleReiceive:" ++ event, "Failed to join channel"))
| _ => Js.log(("handleReiceive:" ++ event, any))
};
let handleEvent = (event, response) => {
let _ = Js.log(("handleEvent:" ++ event, response));
();
};
let handleSyncState = (response) => {
let _ = Js.log(("handleSyncState", response));
/*let _ = Js.log (Array.iter (fun key -> Js.log (Js_dict.unsafeGet response key)) (Js_dict.keys response) ) in*/
let _presences = Presence.syncState(Js.Dict.empty(), response);
();
};
let handleSyncDiff = (diff) => {
let _ = Js.log(("handleSyncDiff:diff", diff));
let presences = Presence.syncDiff(Js.Dict.empty(), diff);
let _ = Js.log(("handleSyncDiff:presences", presences));
();
};
{
let socket = initSocket("/socket") |> connectSocket |> putOnClose(() => Js.log("Socket closed"));
let channel = socket |> initChannel("user:lobby");
let _ =
channel
|> putOn("from_server", handleEvent("from:server"))
|> putOnSyncState(handleSyncState)
|> putOnsyncDiff(handleSyncDiff)
|> joinChannel
|> putReceive("ok", handleReiceive("ok"))
|> putReceive("error", handleReiceive("error"));
push("new:message", {"user": "Hello, Elixir! This is a greeting from BuckleScript!"}, channel);
};
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].