darklang / tablecloth

A standard library with the same API in F#, Rescript and OCaml
https://www.tablecloth.dev
MIT License
513 stars 45 forks source link

API Page UX Improvements #235

Closed Lomand closed 2 years ago

Lomand commented 2 years ago

From the user's perspective, there are some things that the current /api page lacks in terms of readability. I've tried to address that and make documentation more readable and on par with lodash/rambda docs.

In this PR I'll also plan to implement a switcher between F#/Ocaml/Rescript versions.

Current version: image

This PR: image

Since the docs are generated from the source files, I'll need to remove empty lines in the examples section. I still need to add mobile styles as well as tweaks to the dark theme to make this PR ready to merge.

pbiggar commented 2 years ago

This is a big improvement!

Can I suggest you keep the let length : 'a Array.t -> int instead of just going down to 'a Array.t -> int. It seems more readable, and also looks quite nice in the old formatting (vs dropping to the basic code format).

Lomand commented 2 years ago

Sure thing, I'll address that.

Lomand commented 2 years ago

I've added the mobile theme and night mode support with some additional changes. To make Tablecloth more familiar to the average developer I've made the following:

The urls of some pages were changed to more reflect the actual content and resemble the counterparts of similar projects (Lodash & Rambda):

/documentation/installation -> /get-started/installation

This page with other introduction materials was already labeled as "Get started" on the home page even before this PR. Now the urls will be representative of the actual content. TLDR: those pages live under get-started prefix.

/api -> /docs/rescript /docs/ocaml /docs/reason /docs/fsharp

Two changes here: now each of the languages gets its own url, so examples can be linked with preferred language/syntax already preselected (ex: /docs/rescript/#Bool.xor and /docs/ocaml/#Float.subtract), the url itself was changed from api to docs since inlining urls to other projects will provide more pleasant UX for the average developer, who already knows what's in the docs page since they probably used Lodash before.

The Language Logo SVG's were updated, F# and Rescript logo added.

The docs page basically looks like this: image image

There are some things I want to fix before marking this PR as ready (language switcher at home page), as well as possibly address some suggestions.

pbiggar commented 2 years ago

This looks phenomenal! I love the logos in particular and also the url scheme is great.

Do we need reason anymore? AIUI, we don't have reason code anymore.

Lomand commented 2 years ago

Thanks for your feedback! I'll remove Reason from the docs page.

Lomand commented 2 years ago

Looks like it's done:

Cleaned up code, it is now ready to be merged in next.

pbiggar commented 2 years ago

Wonderful! Will give this a read this weekend.

Separately, we've started to release version 0.0.8, so we should be able to merge the next branch soon!