server rendering for fre, It is still in the experimental stage, do not use it for production environment.
const{ h}=require('fre')const{ renderToString, useAction}=require('fre/server')functionApp(){const[posts,setPosts]=useState([])useAction(async()=>{awaitaxios.get('https://api.clicli.us/rank').then(res=>{setPosts(res.data.posts)})})return(<div>{posts.map(item=>(<li>{item.title}</li>))}</div>)}router.get('/',asyncctx=>{letcontent=awaitrenderToString(<App/>)ctx.body=template.replace('<!-- fre -->',content)})
letcontent=awaitrenderToString(<App/>)ctx.body=template.replace('<!-- fre -->',content)
renderToString
will return html strings, you can render with Koa or any other frameworks.
useAction(async()=>{awaitaxios.get('https://api.clicli.us/rank').then(res=>{// do somethins})})
useAction
is more likeuseEffect
, but it has no cleanups, and it receives a promise function. the requests will excutes in server side.
MIT ©hkc452 inspired bypreact