Skip to content

Commit

Permalink
0.32
Browse files Browse the repository at this point in the history
  • Loading branch information
terrablue committed Aug 5, 2024
1 parent 41d17af commit adebfca
Show file tree
Hide file tree
Showing 56 changed files with 1,108 additions and 707 deletions.
108 changes: 68 additions & 40 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,86 +12,109 @@ Polymorphic development platform. To start [read guide].
[![GitHub last commit](https://img.shields.io/github/last-commit/primatejs/primate?style=for-the-badge)](https://github.com/primatejs/primate/commits/master)
[![Discord](https://img.shields.io/discord/1256590312177012806?style=for-the-badge&logo=discord&label=Discord&logoColor=a16836&color=5865f2)](https://discord.gg/RSg4NNwM4f)

## Why use Primate?
## Why Primate?

### Framework Independence
### Mix and match the best web tech, in one stack

Primate stands apart as a framework-agnostic tool, allowing you to seamlessly
integrate and start coding within any major framework, eliminating the
constraints of being tied to specific options like Nuxt, Next, or others.
Primate is a frontend and backend-agnostic tool, allowing you to seamlessly
integrate and start coding within any major frontend framework and several
backend languages, eliminating the constraints of being tied to specific
options like Next, Nuxt, or others. Primate runs on Node, Deno and Bun with the
same codebase.

### Frameworks We Support
### Supported backends

- Svelte
- Go
- JavaScript
- Python
- Ruby
- TypeScript

### Supported frontends

- Angular
- Eta
- Handlebars
- HTML
- HTMX
- Markdown
- Marko
- React
- Solid
- Svelte
- Voby
- Vue
- Angular
- Web Components
- HTMX
- Handlebars
- Marko

### Databases We Support
### Supported databases

- SQLite
- MongoDB
- Postgresql
- MySQL
- Postgresql
- SQLite
- SurrealDB

### Languages We Support

- JavaScript
- TypeScript
- Golang
- Python
- Ruby

## Packages

| Package | Description |
|---------------------------------------------|-------------------------------|
|[primate](packages/primate) | Primate framework |
|[create-primate](packages/create-primate) | GUI for creating Primate apps |
|[@primate/frontend](packages/frontend) | Frontend frameworks |
|[@primate/store](packages/store) | Data store |
|[@primate/types](packages/types) | Runtime types |
|[@primate/core](packages/core) | Core framework |
|[@primate/go](packages/go) | Go backend |
|[@primate/python](packages/python) | Python backend |
|[@primate/ruby](packages/ruby) | Ruby backend |
|[@primate/typescript](packages/typescript) | TypeScript backend |
|[@primate/angular](packages/angular) | Angular frontend |
|[@primate/eta](packages/eta) | Eta frontend |
|[@primate/handlebars](packages/handlebars) | Handlebars frontend |
|[@primate/html](packages/html) | HTML frontend |
|[@primate/htmx](packages/htmx) | HTMX frontend |
|[@primate/markdown](packages/markdown) | Markdown frontend |
|[@primate/marko](packages/marko) | Marko frontend |
|[@primate/react](packages/react) | React frontend |
|[@primate/solid](packages/solid) | Solid frontend |
|[@primate/svelte](packages/svelte) | Svelte frontend |
|[@primate/voby](packages/voby) | Voby frontend |
|[@primate/vue](packages/vue) | Vue frontend |
|[@primate/webc](packages/webc) | Web Components frontend |
|[@primate/store](packages/store) | Databases |
|[@primate/mongodb](packages/mongodb) | MongoDB database |
|[@primate/mysql](packages/mysql) | MySQL database |
|[@primate/postgresql](packages/postgresql) | PostgreSQL database |
|[@primate/sqlite](packages/sqlite) | SQLite database |
|[@primate/surrealdb](packages/surrealdb) | SurrealDB database |
|[@primate/types](packages/types) | Schema validation |
|[@primate/session](packages/session) | User sessions |
|[@primate/i18n](packages/i18n) | Internationalization |
|[@primate/binding](packages/binding) | Other backend languages |
|[@primate/native](packages/native) | Compile native apps |
|[website](packages/website) | Primate website |
|[create-primate](packages/create-primate) | GUI for creating Primate apps |

## Comparison with other frameworks

|Feature |Next |Nuxt |SvelteKit|Primate |
|------------------|------|------|---------|--------------------------------------------------------|
|Backend |JS, TS|JS, TS|JS, TS |JS, TS, Go, Python, Ruby |
|Frontend |React |Vue |Svelte |React, Vue, Svelte, Solid, Angular, HTMX, Handlebars, WC|
|Native runtime |Node |Node |Node |Node, Deno, Bun |
|Runtime |Node |Node |Node |Node, Deno, Bun |
|I18N ||||@primate/i18n |
|Head Component ||||React, Svelte, Solid |
|Route guards |||||
|Recursive layouts |||||
|Data stores/ORM ||||SQLite, PostgreSQL, MongoDB, SurrealDb |
|Data stores/ORM ||||MongoDB, MySQL, PostgreSQL, SQLite, SurrealDb |
|WebSockets |||||
|Server-sent events|||||
|User sessions ||||@primate/session |

## Resources

* Website: https://primatejs.com
* IRC: Join the `#primate` channel on `irc.libera.chat`
* Discord: https://discord.gg/RSg4NNwM4f
* Reddit: [r/primatejs](https://reddit.com/r/primatejs)
* Twitter (X): [@primatejs](https://x.com/primatejs)
* Blog: https://primatejs.com/blog
* StackOverflow: https://stackoverflow.com/questions/tagged/primate

## Example Applications

- [starter app](https://github.com/primatejs/app) - demos most of the features of Primate
- [FastestEngineer](https://fastest.engineer) - A fully-featured SaaS boilerplate
* Demo app: https://github.com/primatejs/app

## License

Expand All @@ -102,10 +125,15 @@ MIT
By contributing to Primate, you agree that your contributions will be licensed
under its MIT license.

Clone https://github.com/primatejs/app alongside your Primate directory and
switch to the `dev` branch. This branch uses symbolic links to Primate and its
modules. In the case of some modules (`@primate/frontend`, `@primate/i18n`,
`@primate/binding`), symbolic links lead to errors and the modules need to be
copied in verbatim. Use the `refresh-deps.sh` script to do so.
Clone this repo and https://github.com/primatejs/app in the same location,
and switch to the `dev` branch in the app repo. Then, in the app repo, run

* `npm run node` for Node in development mode
* `npm run node:prod` for Node in production mode
* `npm run deno` for Deno in development mode
* `npm run deno:prod` for Deno in production mode
* `npm run bun` for Bun in development mode
* `npm run bun:prod` for Bun in production mode
* `npm run bun:compile` for compiling desktop app with Bun

[read guide]: https://primatejs.com/guide/getting-started
36 changes: 17 additions & 19 deletions docs/blog/introducing-a-head-component.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,17 +13,13 @@ If you're new to Primate, we recommend reading the [Getting started] page to
get an idea of the framework.
!!!

## Install

To use `Head`, update `@primate/frontend` to version `0.5.0` or later.

## Use

In a component of your choice, import `Head` from `@primate/frontend/react` and
In a component of your choice, import `Head` from `@primate/react` and
use it anywhere within the component.

```js caption=components/PostIndex.jsx
import { Head } from "@primate/frontend/react";
import Head from "@primate/react/head";

export default function (props) {
return <>
Expand All @@ -40,22 +36,22 @@ export default function (props) {
```

!!!
For Solid, replace `@primate/frontend/react` with `@primate/frontend/solid`.
For Solid, replace `@primate/react` with `@primate/solid`.
!!!

You can also use `Head` in any layout. During SSR, a combined list of head
tags will be generated and sent along with the page. Later during hydration,
the client components will take over management of their head tags.

If you use `@primate/liveview` to navigate between pages without a full reload,
`Head` will manage its head tags between page changes, automatically removing
the tags used by the previous page's components and inserting new ones. Tags in
`pages/app.html` won't be managed by `Head` and will be left intact.
When you navigate between pages without a full reload, `Head` will manage its
head tags between page changes, automatically removing the tags used by the
previous page's components and inserting new ones. Tags in `pages/app.html`
won't be managed by `Head` and will be left intact.

## Use outside of Primate

As `@primate/frontend` exports `react/Head` and `solid/Head` and has virtually
no dependencies, you can use it even if you don't use Primate itself.
As `@primate/react` and `@primate/solid` exports `/Head` and have virtually no
dependencies, you can use it even if you don't use Primate itself.

### Without SSR

Expand Down Expand Up @@ -117,18 +113,20 @@ The only thing left to do is wrap your root component with a context provider.
It is assumed that `body` here contains your component hierarchy.

```js caption=root-component-react.jsx
import { HeadContext, is } from "@primate/frontend/react";
import HeadContext from "@primate/react/context/head";
import platform from "@rcompat/platform";

const Provider = HeadContext.Provider;

export default ({ components, data, push_heads: value }) =>
is.client ? body : <Provider value={value}>{body}</Provider>;
platform === "browser" ? body : <Provider value={value}>{body}</Provider>;
```

For Solid, use `@primate/frontend/solid` instead for the import.
For Solid, use `@primate/solid` instead for the import.

We use here the `is` export to check if we're on the client or the server. You
don't have to do it, but using the provider on the client doesn't make a lot of
sense.
We use check, using `@rcompat/platform` if we're on the client or the server.
You don't have to do this, but using the provider on the client doesn't make a
lot of sense.

## Fin

Expand Down
42 changes: 20 additions & 22 deletions docs/blog/introducing-rcompat.md
Original file line number Diff line number Diff line change
Expand Up @@ -29,30 +29,30 @@ JavaScript offers this kind of flexibility.

## Batteries included

rcompat is designed with many submodules in mind, including `rcompat/fs` for
filesystem operations, `rcompat/http` for using a modern HTTP server working
rcompat is designed with many submodules in mind, including `@rcompat/fs` for
filesystem operations, `@rcompat/http` for using a modern HTTP server working
with WHATWG `Request`/`Response` (which Node doesn't support; rcompat wraps
a Node request object into a WHATWG `Request` as it comes in),
`rcompat/invariant` for ensuring runtime invariants, `rcompat/object` for
`@rcompat/invariant` for ensuring runtime invariants, `@rcompat/object` for
object transformations, and many more useful modules and abstractions.

The standard library is designed to accommodate modern development needs: for
example, `rcompat/http` supports WebSockets (natively on Deno/Bun, and using
NPM's `ws` on Node), while `rcompat/fs.File` offers globbing, listing and
example, `@rcompat/http` supports WebSockets (natively on Deno/Bun, and using
NPM's `ws` on Node), while `@rcompat/fs/file` offers globbing, listing and
manipulation of files, similarly to Python's `pathlib`.

For example, to set up a server with rcompat, use the `serve` export of
`rcompat/http` -- the server-side equivalent of `fetch`.
For example, to set up a server with rcompat, use `@rcompat/http/serve` -- the
server-side equivalent of `fetch`.

```js
import { serve } from "rcompat/http";
import serve from "@rcompat/http/serve";

serve(request => new Response("Hi!"), { host: "localhost", port: 6161 });
```

This code runs successfully with either `node app.js` (if you set your
package.json to `{ "type": "module" }`; otherwise use `app.mjs`), `deno run
--allow-all app.js` or `bun --bun app.js`, taking advantage of native
package.json to `{ "type": "module" }`; otherwise use `app.mjs`),
`deno run -A app.js` or `bun --bun app.js`, taking advantage of native
optimizations.

## Another standard library?
Expand All @@ -69,11 +69,9 @@ target everything.
For example, here's how you can read a file and parse it as JSON.

```js
import FS from "rcompat/fs";
// or import individually, shadowing globalThis.File, WHATWG's File class
// import { File } from "rcompat/fs";
import file from "@rcompat/fs/file";

console.log(await FS.File.json("./users.json"));
console.log(await file("./users.json").json());
```

Again, this code runs successfully on Node, Deno or Bun, taking advantage of
Expand All @@ -86,14 +84,14 @@ Primate's development and is largely influenced by its needs. We'd like to
invite more participation by other projects / individuals in order to converge
on APIs that best serve everyone and are the most useful on a broad basis.

To illustrate this, Primate 0.31 will be using `rcompat/fs`'s upcoming `Router`
class, which is meant to be used by frameworks using filesystem-routing (such
as Primate, Next, SvelteKit, etc.) to resolve requests to routes. The design is
aimed to be generic, but undoubtedly will be influenced by Primate's needs.
External feedback will help keep it useful for other frameworks as well.
Once `FS.Router` is ready, we will also aim to upstream our ideas to Bun's
native [FileSystemRouter][FileSystemRouter] class such that rcompat can
delegate to it natively on Bun.
To illustrate this, Primate 0.31 will be using `@rcompat/fs/router`'s upcoming
`Router` class, which is meant to be used by frameworks using
filesystem-routing (such as Primate, Next, SvelteKit, etc.) to resolve requests
to routes. The design is aimed to be generic, but undoubtedly will be
influenced by Primate's needs. External feedback will help keep it useful for
other frameworks as well. Once `Router` is ready, we will also aim to upstream
our ideas to Bun's native [FileSystemRouter][FileSystemRouter] class such that
rcompat can delegate to it natively on Bun.

## Participation

Expand Down
4 changes: 2 additions & 2 deletions docs/blog/release-021.md
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@ and responds with a proper handler. Here is an example with an error route
file rendering a Svelte component.

```js caption=routes/+error.js
import { view } from "primate";
import view from "primate/handler/view";

export default request => view("ErrorPage.svelte");
```
Expand Down Expand Up @@ -113,7 +113,7 @@ passing a `page` property to the third handler parameter. The page file itself
must be located under `pages`.

```js caption=routes/+error.js
import { view } from "primate";
import view from "primate/handler/view";

export default request => view("ErrorPage.svelte", {}, {
page: "other-error.html",
Expand Down
6 changes: 3 additions & 3 deletions docs/blog/release-022.md
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ energy to mankind.
Lastly, serve your Markdown component from a route of your choice.

```js caption=routes/about-us.js
import { view } from "primate";
import view from "primate/handler/view";

export default {
get() {
Expand All @@ -60,7 +60,7 @@ props to it is meaningless. However, you can still use a different page with it
by modifying the `page` property of the third (options) parameter.

```js caption=routes/about-us.js
import { view } from "primate";
import view from "primate/handler/view";

export default {
get() {
Expand Down Expand Up @@ -180,7 +180,7 @@ function directly as an export of `@primate/markdown`. This allows you to
compile and serve Markdown content from a dynamic source (like a database).

```js caption=routes/markdown/{page}.js
import { view } from "primate";
import view from "primate/handler/view";
import { compile } from "@primate/markdown";

export default {
Expand Down
Loading

0 comments on commit adebfca

Please sign in to comment.