jetli / rust-yew-realworld-example-app Goto Github PK

I'm trying to host my sample website on GitHub pages but I'm struggling to get router working.

This is the website
https://s1n7ax.github.io/my-website/

It's showing 404 page because there is no route /my-website. How did you manage get it working on your website? Plus, I noticed all the links has rust-yew-realworld-example-app. How are you doing all that?

Describe the bug
Anchor on hover show the link to be navigated on bottom left corner in chrome. But its not showing in the app.

possible to reduce reliance on npm / js?

Hey!

I was trying to run this frontend in combination with the Rust (Tide + Diesel) backend we wrote (https://github.com/colinbankier/realworld-tide) and I realised that it's currently impossible to configurable the URI of the backend, given that it's hard-coded as

const API_ROOT: &str = "https://conduit.productionready.io/api";

Would it be possible to make it configurable, either via a configuration file or an environment variable?
It would be amazing to be able to give instructions to run a full Rust web-app, FE+BE, without having to ask the user to touch the source code 😁

Describe the bug
This is not an app specific issue, but it's just how GitHub Pages handles the URLs.
Of course, you may argue that this is not app specific, but it seems easy to solve it.

To Reproduce
Steps to reproduce the behavior:

1. Go to Home
2. Click on Gerome that is the author of the articles.
3. This is working as it's handled by the SPA that runs in the browser (and the browser is informed not to do a full reload).
4. If you access Gerome link directly (as you may do by hitting F5), then you get the classic 404 page of GitHub Pages.

Expected behavior
Of course, expected to get a consistent behavior and see that page again.

Solution
There seems to be a pretty standard way of handling this through examples such as this one.

Should I test it and send a PR or you'll do it?

Last but not least, thank you so much for sharing this. 🙏
I'm starting to evaluate yew and I saw your comment in one of those production ready issues. That's how I got here.

When click on a tag from the popular tabs I get the error bellow on the console, and the app freezes after that. I am on a Mac running Monterey, and using Firefox 91.0.2

Panic error message: called Result::unwrap()on anErr value: http::Error(InvalidUri(InvalidUriChar))

run cargo tauri dev

found following error.

Compiling conduit-tauri v0.1.0 (F:\rs\rust-yew-realworld-example-app\crates\conduit-tauri)
error: failed to run custom build command for conduit-tauri v0.1.0 (F:\rs\rust-yew-realworld-example-app\crates\conduit-tauri)

Caused by:
process didn't exit successfully: F:\rs\rust-yew-realworld-example-app\target\debug\build\conduit-tauri-e819a3ad61e3ad6e\build-script-build (exit code: 101)
--- stdout
cargo:rerun-if-env-changed=TAURI_CONFIG
cargo:rerun-if-changed=tauri.conf.json

--- stderr
thread 'main' panicked at 'error found during tauri-build: Error("unknown field useBootstrapper, expected depends or files", line: 1, column: 746)', C:\Users\Administrator.cargo\registry\src\mirrors.ustc.edu.cn-12df342d903acd47\tauri-build-1.0.0-rc.8\src\lib.rs:146:5

Is your feature request related to a problem? Please describe.
Add a desktop version and release it in CD

Describe the solution you'd like
web-view may be a good way to do this.

npm run build

build
cd crates/conduit-wasm && npm run build

[email protected] build
cross-env WASM_PACK_PROFILE=release parcel build static/index.html --public-url ./
🚨 /go/src/git.bcz.com/cloud/app/rust-yew-realworld-example-app/crates/conduit-wasm/Cargo.toml: Command failed: wasm-pack build --release
[INFO]: Checking for the Wasm target...
[INFO]: Compiling to Wasm...
Finished release [optimized] target(s) in 0.29s
[WARN]: :-) origin crate has no README
[INFO]: License key is set in Cargo.toml but no LICENSE file(s) were found; Please add the LICENSE file(s) to your project directory
[INFO]: Installing wasm-bindgen...
Error: failed to download from https://github.com/WebAssembly/binaryen/releases/download/version_90/binaryen-version_90-x86-linux.tar.gz
To disable wasm-opt, add wasm-opt = false to your package metadata in your Cargo.toml.

[INFO]: Checking for the Wasm target...
[INFO]: Compiling to Wasm...
Finished release [optimized] target(s) in 0.29s
[WARN]: :-) origin crate has no README
[INFO]: License key is set in Cargo.toml but no LICENSE file(s) were found; Please add the LICENSE file(s) to your project directory
[INFO]: Installing wasm-bindgen...
Error: failed to download from https://github.com/WebAssembly/binaryen/releases/download/version_90/binaryen-version_90-x86-linux.tar.gz
To disable wasm-opt, add wasm-opt = false to your package metadata in your Cargo.toml.

at ChildProcess.exithandler (child_process.js:308:12)
at ChildProcess.emit (events.js:314:20)
at maybeClose (internal/child_process.js:1022:16)
at Socket.<anonymous> (internal/child_process.js:444:11)
at Socket.emit (events.js:314:20)
at Pipe.<anonymous> (net.js:676:12)

✨ Built in 15ms.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

I ran this project in the ubuntu system.There are some "Http Request Error" on the Sign Up page. But I can't find the log files for this project.

Additional context
Add any other context or screenshots about the feature request here.

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:

1. Load docker in Fedora 36
2. Run docker compose up
3. Access website at port 8000

Expected behavior
No errors

Screenshots

Desktop (please complete the following information):

• OS: Fedora 36 KDE
• Browser Chrome and Firefox / N.A
• Version N.A

This example is no longer correct as of yew 0.18.0 due to breaking changes ( IntoPropValue, ImplicitClone)
see yewstack/yew#1888, yewstack/yew#1895

The template for article-meta is as follow:

      <div class="article-meta">
        <a href=""><img src="http://i.imgur.com/Qr71crq.jpg" /></a>
        <div class="info">
          <a href="" class="author">Eric Simons</a>
          <span class="date">January 20th</span>
        </div>
        <button class="btn btn-sm btn-outline-secondary">
          <i class="ion-plus-round"></i>
          &nbsp;
          Follow Eric Simons <span class="counter">(10)</span>
        </button>
        &nbsp;&nbsp;
        <button class="btn btn-sm btn-outline-primary">
          <i class="ion-heart"></i>
          &nbsp;
          Favorite Post <span class="counter">(29)</span>
        </button>
      </div>

It includes a 'favorite button' and a 'follow button'.

The code here just creates edit and delete button in case of self-own article. No code for 'favorite' and 'follow'

Hi,
I also have a realworld implementation, but using a different frontend framework. I copied services and types from your implementation. So, I'd like to say "thank you" to you because I reuse your code in mine.

After all, I'd like to have a discussion about gloo-net and reqwest. Have you ever heard of gloo-net? I do an experiment with it and the .wasm binary using gloo-net is about 300 kb smaller than using reqwest.

If you want to have a look at my experiments, here is my implementation.

Thank you again for the code that I reuse!

It would be interesting to see the Yew application handle calling the Tauri js API and receiving results from the backend via Tauri Commands.

For many desktop applications this is the only reason Tauri isn't currently suitable for WASM yet and since there are so many needs for backend code (e.g. connecting to sqlite database, filesystem processing, secure communication) this becomes the determining factor against using wasm in Tauri.

...or can this be proven wrong?!

Describe the bug
When I run docker-compose up I get the following error:

conduit-wasm_1  | Server running at http://localhost:8000 
conduit-wasm_1  | ?  /usr/src/conduit-wasm/Cargo.toml: ENOENT: no such file or directory, open '/usr/src/conduit-wasm/pkg/conduit_wasm_bg.js'
conduit-wasm_1  | Error: ENOENT: no such file or directory, open '/usr/src/conduit-wasm/pkg/conduit_wasm_bg.js'
conduit-wasm_1  | Unexpected error while opening in browser: true
conduit-wasm_1  | Error: Exited with code 3
conduit-wasm_1  |     at ChildProcess.<anonymous> (/usr/src/conduit-wasm/node_modules/opn/index.js:85:13)
conduit-wasm_1  |     at Object.onceWrapper (events.js:422:26)
conduit-wasm_1  |     at ChildProcess.emit (events.js:315:20)
conduit-wasm_1  |     at maybeClose (internal/child_process.js:1021:16)
conduit-wasm_1  |     at Socket.<anonymous> (internal/child_process.js:443:11)
conduit-wasm_1  |     at Socket.emit (events.js:315:20)
conduit-wasm_1  |     at Pipe.<anonymous> (net.js:674:12)

Expected behavior
It should build and show up on the webpage.

Desktop (please complete the following information):

• OS: Ubuntu 20.04
• Browser: FireFox
• Version: Master

Hello!

Due to governance changes, we are now using the realworld.io domain for the RealWorld demo (both client and API).
Requests from conduit.productionready.io are redirected to api.realworld.io, but such a redirection might lead to inconsistent responses.

We encourage domain change for the community.
If this repository is maintained anymore, we'll consider hosting a demo of your implementation in a few weeks with the domain change.

The demo link will be added to the RealWorld documentation.

Describe the bug
I following the guide, start the app, but got error.

To Reproduce
Steps to reproduce the behavior:

1. npm start

npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.

> start
> cd crates/conduit-wasm && npm start

npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.

> [email protected] start
> cross-env WASM_PACK_PROFILE=dev parcel static/index.html -p 8000 --open

Server running at http://localhost:8000 
√  Built in 482ms.

2. Open Chrome, got white page, the console output

 Uncaught TypeError: Cannot read properties of undefined (reading 'memory')
    at parcelRequire.../node_modules/parcel-plugin-wasm.rs/wasm-loader.js.fs (wasm-loader.js:913:1)
    at newRequire (static.77de5100.js:47:24)
    at localRequire (static.77de5100.js:53:14)
    at parcelRequire.0 (wasm-loader.js:958:1)
    at newRequire (static.77de5100.js:47:24)
    at static.77de5100.js:81:7
    at static.77de5100.js:120:3

3. I also tried run tauri version, but still have problem.

cargo tauri dev
     Running BeforeDevCommand (`npm start`)
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.

> start
> cd crates/conduit-wasm && npm start

npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.

> [email protected] start
> cross-env WASM_PACK_PROFILE=dev parcel static/index.html -p 8000 --open

Server running at http://localhost:8000 
√  Built in 511ms.
   Compiling webview2-com v0.16.0
   Compiling conduit-tauri v0.1.0 (D:\ideaProjects\world_hello\rust-yew-realworld-example-app\crates\conduit-tauri)
error: failed to run custom build command for `conduit-tauri v0.1.0 (D:\ideaProjects\world_hello\rust-yew-realworld-example-app\crates\conduit-tauri)`

Caused by:
  process didn't exit successfully: `D:\ideaProjects\world_hello\rust-yew-realworld-example-app\target\debug\build\conduit-tauri-7686d36fb79bdf2b\build-script-build` (exit code: 101)
  --- stdout
  cargo:rerun-if-env-changed=TAURI_CONFIG
  cargo:rerun-if-changed=tauri.conf.json
  cargo:rustc-cfg=dev
  package.metadata does not exist
warning: build failed, waiting for other jobs to finish...

Desktop (please complete the following information):

• OS: [Windows 11
• Browser [hrome]
• Version [ 103.0.5060.53]

Additional context
I am a beginer for rust, would you help me to run this app?

As I download this today, and type "docker-compose up"

I see this maintenance warning.. As I find a solution I will create a PR.

Step 2/10 : RUN curl -sL https://deb.nodesource.com/setup_12.x | bash -
---> Running in 69f6542d3d17

================================================================================

                          DEPRECATION WARNING                            

Node.js 12.x is no longer actively supported!

You will not receive security or critical stability updates for this version.

You should migrate to a supported version of Node.js as soon as possible.
Use the installation script that corresponds to the version of Node.js you
wish to install. e.g.

• https://deb.nodesource.com/setup_14.x — Node.js 14 LTS "Fermium" (recommended)
• https://deb.nodesource.com/setup_16.x — Node.js 16 "Gallium"
• https://deb.nodesource.com/setup_18.x — Node.js 18 "Eighteen" (current)

Please see https://github.com/nodejs/Release for details about which
version may be appropriate for you.

The NodeSource Node.js distributions repository contains
information both about supported versions of Node.js and supported Linux
distributions. To learn more about usage, see the repository:
https://github.com/nodesource/distributions

================================================================================

shows blank screen whether compiled in docker or even on localhost

This project mentions its goal is to produce a project sample that adheres closely to Yew idioms. As far as build tooling goes, I'm curious why Trunk isn't used?

Is your feature request related to a problem? Please describe.
I think there is a RwLock that isn't needed here: https://github.com/jetli/rust-yew-realworld-example-app/blob/master/crates/conduit-wasm/src/agent.rs#L23

Describe the solution you'd like
I think you could use a RefCell instead.

Additional context
Because your app is only running in a single "thread", there isn't a reason to use an RwLock.
It appears that you are only using it to enable interior mutability, which can be provided by a RefCell instead.

In fact you don't need to keep the token in memory and instead just get/set the token directly via the bowser's storage API, but I understand that you could want to avoid that in order to improve performance by a small amount.

Describe the bug
Articles with <img onerror="alert(1)"></img> in the body trigger XSS

To Reproduce
Steps to reproduce the behavior:

1. Go to https://jetli.github.io/rust-yew-realworld-example-app/#/article/img-src-onerror-alert-xss-in-title-with-img-onerror-img-dvpw7w
2. See alert

Expected behavior
The body is shown without an alert triggering

Screenshots

The problem in the code is here. pulldown_cmark doesn't sanitize.

agents.rs is a big file with a lots of code and domains implemented.
It is hard to support such a big code files.

This will be good to split this file to a separate models and services that will concentrate on particular domains, e.g. authentication, articles, comments and etc.

I made my example of how this can be done and like to share it.
Please allow me to push to a separate "feature" branch, so then you can review and merge if this will be suitable.

Is your feature request related to a problem? Please describe.
ref:

• https://github.com/yewstack/yew/tree/master/examples/futures
• https://github.com/extraymond/rust-async-wasm-demo