https://github.com/frejs/fre-server
fre-server
https://github.com/frejs/fre-server
Last synced: 8 months ago
JSON representation
fre-server
- Host: GitHub
- URL: https://github.com/frejs/fre-server
- Owner: frejs
- Created: 2019-12-09T13:35:02.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2023-01-05T02:37:59.000Z (over 3 years ago)
- Last Synced: 2024-12-27T07:42:52.369Z (over 1 year ago)
- Language: JavaScript
- Size: 599 KB
- Stars: 0
- Watchers: 2
- Forks: 1
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# fre/server
> server rendering for fre, It is still in the experimental stage, do not use it for production environment.
### Use
```js
const { h } = require('fre')
const { renderToString, useAction } = require('fre/server')
function App() {
const [posts, setPosts] = useState([])
useAction(async () => {
await axios.get('https://api.clicli.us/rank').then(res => {
setPosts(res.data.posts)
})
})
return (
{posts.map(item => (
{item.title}
))}
)
}
router.get('/', async ctx => {
let content = await renderToString()
ctx.body = template.replace('', content)
})
```
### RenderToString
```js
let content = await renderToString()
ctx.body = template.replace('', content)
```
`renderToString` will return html strings, you can render with Koa or any other frameworks.
### UseAction
```js
useAction(async () => {
await axios.get('https://api.clicli.us/rank').then(res => {
// do somethins
})
})
```
`useAction` is more like `useEffect`, but it has no cleanups, and it receives a promise function. the requests will excutes in server side.
#####
MIT ©[hkc452](https://github.com/hkc452) inspired by [preact]()