datastar icon indicating copy to clipboard operation
datastar copied to clipboard

Can we get a super simple example for the README, and link to the documentation?

Open coolaj86 opened this issue 1 year ago • 1 comments

From the conference talk and the podcast I get the "why", but I have no idea of the "how" or "what".

I need the full-loop hello world.

Either how do I run an example locally against a public demo server,

Or how do I set up a basic express server serving the hello world from the public folder.

I'm completely outside the loop of the htmx community. I don't even do frontend (when I can avoid it).

I'd love to see a header section.

Documentation

  • Quick Start: [link]
  • Guide: [link]
  • API: [link]
  • Examples: [link]

coolaj86 avatar Oct 05 '24 06:10 coolaj86

PRs welcomed in this department.

I just did https://github.com/delaneyj/realworld-datastar which a more of a basic "normal" app. Does this help or is it too much other stuff.

In general Datastar should/will be a tiny part of your app and will just get out of your way.

Please join the Discord and let's talk!

delaneyj avatar Oct 05 '24 19:10 delaneyj

I'm gonna close soon @coolaj86 if I don't hear back

delaneyj avatar Oct 15 '24 03:10 delaneyj

@delaneyj I'm not qualified to create those examples, because I don't have enough information to know what I would be doing.

coolaj86 avatar Oct 15 '24 17:10 coolaj86

For example, in the link you gave there's no information about how to run the server:

https://github.com/delaneyj/realworld-datastar

It looks like the Get Started section was copied from another repo (go-task).

For a go repo I would expect something like

Getting Started

Build and run the project like this:

go generate ./...
go run <the thing>

You can connect on the default port at:

But even that is getting ahead. What's the Hello World? What's the smallest unit of the thing that this does?

Something like

Install Datastar JavaScript

npm install --save datastar

./public/hello.html:

<html>
  <head> ... </head>
  <body>
    <div data-define-target="message"></div>

    <form>
      <label>Foo:
        <input type="text" name="foo" value="bar" />
      </label>
      <button data-do-a-thing="POST /views/that-tickles" data-to-a-target="message">Tickle Me!</button>
    </form>

    <script src="./assets/datastar.js"></script>
  </body>
</html>

./serve.go:

router.handle(`POST /views/`, func (w http.Writer, r *http.Request) {
  w.Write(fmt.Sprintf(`That tickles. %s!`, r.Query.Get("foo")))
})
go run ./serve.go

coolaj86 avatar Oct 15 '24 17:10 coolaj86

How about something like this article @coolaj86? https://dev.to/blinkinglight/golang-data-star-1o53 by @blinkinglight

delaneyj avatar Oct 17 '24 14:10 delaneyj