An HTTP request example and a tailwindcss styling example

[attriaayush]

I created this example (since I could not find an existing one) to get a feel for the developer experience of using a crate like reqwasm and styling with TailwindCSS when using sycamore.

This example makes a GET request to CountAPI that simply increments everytime you visit the page or refresh the page i.e. counting page visits. I picked this example since I just wanted to create a really simple HTTP request to fetch some json data and then be able to display that data which then further updates a Signal and resulting into updating the relevant component.

This also includes a little styling with TailwindCSS since the docs here suggested that the styling part is still under works.

To test, you can run trunk serve --open which should build everything and the serve the page.

[lukechu10]

I think it would be better to separate http requests using reqwasm and styling using tailwindcss into 2 distinct examples instead of combining them into one. What do you think?

[attriaayush]

I think it would be better to separate http requests using reqwasm and styling using tailwindcss into 2 distinct examples instead of combining them into one. What do you think?

Thanks for reviewing the pull request.

That makes sense and I agree. More than happy to split this example into two distinct examples.

[attriaayush]

@lukechu10
I have split this into two distinct examples. Still using the same base of http request example using reqwasm but this time isolating the tailwindcss styling setup into a different example that just simply builds on top of the previous example with a unique website_id.

Hope these are useful examples.

[lukechu10]

I'm not sure if it's best to have the tailwindcss example also include http request but I think it's fine for now.

[lukechu10]

Also CI is failing because latest reqwasm uses edition 2021 which needs rust 1.56 and sycamore's MSRV is currently 1.53.
I sent a PR to reqwasm changing edition back to 2018.

[attriaayush]

@lukechu10
Appreciate the feedback, I believe that all should be addressed now.

I'm not sure if it's best to have the tailwindcss example also include http request but I think it's fine for now.

My thinking behind this was that tailwindcss is just a styling layer and it could potentially be added to any existing example. In this case now that we have an isolated example for http why not just extend it and style the relevant component. Also majority of the time projects do contain http requests and styling thought it might represent that side of it in a really simple form.

[lukechu10]

lgtm. I'm just waiting for reqwasm to push a new release so that it's compatible with rust 1.53

[codecov-commenter]

Codecov Report

Merging #305 (dd1d2f1) into master (7738584) will decrease coverage by 0.00%.
The diff coverage is n/a.

@@            Coverage Diff             @@
##           master     #305      +/-   ##
==========================================
- Coverage   73.21%   73.20%   -0.01%     
==========================================
  Files          38       40       +2     
  Lines        5313     5431     +118     
==========================================
+ Hits         3890     3976      +86     
- Misses       1423     1455      +32     

Impacted Files	Coverage Δ
website/src/main.rs	0.81% <0.00%> (-0.01%)	⬇️
packages/sycamore/src/builder/html.rs	100.00% <0.00%> (ø)
packages/sycamore/src/builder/agnostic/mod.rs	65.55% <0.00%> (ø)
packages/sycamore-macro/src/component/mod.rs	76.25% <0.00%> (+0.78%)	⬆️
packages/sycamore/src/utils/render.rs	58.49% <0.00%> (+0.96%)	⬆️
packages/sycamore/src/utils/hydrate/mod.rs	79.16% <0.00%> (+3.75%)	⬆️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 7738584...dd1d2f1. Read the comment docs.

[lukechu10]

I removed the non-tailwind example because in retrospect, I think it's better to not have duplicated code