Stable 1.0.0, we are almost there!
This release is probably the penultimate before the stable release.
It brings us 2 majors things:
- 🎉 For React users, 2 methods, supported via the new
withInitialProps
HOC, allows you to consume any kind of data (not just Phenomic API but any kind of REST APIs, GraphQL APIs for CMS etc) viastatic async getInitialProps()
. This API, inspired by Next.js is not alone as it comes with another new method for the pre-rendering step, calledstatic async getAllPossibleUrls()
. - 💪 We adjusted 2 transform plugins (markdown and asciidoc) so you can directly pass to those the unified plugins you want to use.
This release is an important step for us as it brings us our missing pieces to be happy with Phenomic current state.
Stay tuned for the final release, that will be done at the same time as we will publish documentations on the website.
🤩 We also created a new react-app-blog example that you can use as a good starting point to create any site (not only a blog - and we plan to push more examples when we will hit stable 1.0.0).
This starter includes some pages, some posts, and the usage of our new fresh API to create pages from github data (but you can just use this and replace with any kind of API) to generate client side and static generated pages from those data!
For the architecture, we used something simple, with a few components for header/footer with differents layouts etc. We also included a standard error page (used for 404).
For the styling, we didn't wanted to do something too opinionated and also something too old school (CSS in dedicated files since we all love CSS-in-JS), so we took an simple approach in the middle, with a CSS style tags per components. This allows CSS lover to just extract the CSS in files, and CSS-in-JS lovers to easily convert in places the styles. Remember that we have plenty of examples to know how to handle CSS via any kind of solutions.
You will find a visual preview at the end of this post.
Details
⚠️ @phenomic/plugin-renderer-react
: createContainer
is now withPhenomicApi
(you will get a warning until you update your import) by @MoOx
Not a breaking change yet, but will be during stable 1.0.0 release.
🐛 @phenomic/plugin-collector-files
: fix edge case when you request an index file with an id (db was not correctly filled) by @MoOx
🐛 @phenomic/core
: fix edge case when you request an empty id (for index
) by @MoOx
🐛 @phenomic/core
: fix time log between pre-rendering and after build hook by @MoOx
🐛 @phenomic/plugin-transform-markdown
: code is now highlighted without failing if language is not recognized by @MoOx
🚨@phenomic/plugin-transform-markdown
: remark/rehype plugins order have been changed a bit by @MoOx
This should only affect you if you were relying on (previously broken) code highlight.
🚨/✨ @phenomic/plugin-transform-asciidoc
: plugin have been update to work like markdown. by @MoOx
Previously we never tested this plugin on a real project so we are not sure it has ever worked correctly 😁.
✨ @phenomic/plugin-transform-markdown
: you can now specifiy options for highlighting language unsupported by default by @MoOx
✨ @phenomic/plugin-transform-markdown
: you can now choose between json/html mode for the rendering via output
option by @MoOx
✨ @phenomic/plugin-transform-markdown
: new plugins
option to replace unified/remark/rehype plugins by @MoOx
✨ @phenomic/plugin-transform-asciidoc
: you can now choose between json/html mode for the rendering via output
option by @MoOx
✨ @phenomic/plugin-transform-asciidoc
: new plugins
option to replace unified/remark/rehype plugins by @MoOx
✨ @phenomic/helpers-transform
: new package that exposes stuff shared across transform plugin by @MoOx
✨ @phenomic/plugin-renderer-react
: withInitialProps
HOC that supports static async getInitialProps({pathname, params})
and static async getAllPossibleUrls({path})
by @MoOx
This allows to generate pages with any source of data (fetch from any kind of REST, Grapql APIs).
Inspired by Next.js.
You can check our example of usage in our react-app-blog example
✨ @phenomic/plugin-renderer-react
: withPhenomicApi
HOC (previously named createContainer
) by @MoOx
🎉 examples/react-app-blog: a sweet starter to discover phenomic with react and make a blog in a few minutes by @MoOx