Recently I've joined a new job and they are working with Salesforce. They have all pages with APEX and I propose to migrate to Lightning components.
I've created the first 7 components and I'm using Atomic Design Methodology (https://atomicdesign.bradfrost.com/chapter-2/) to develop these components.
I want to implement stories (with Storybook) or another similar library to document and put examples of each web component.
My question is... Is it possible? I try to install Storybook in the project and isn't working. The question is simple, whether or not you can. And if not, if you know any alternative to it.
Thank you!
In order to use Storybook, you will need to follow the provided Storybook documentation for lightning "Web Component" rather than the other available options like React and configure your VS Code to work with your SF Environment. Also, you might want to look into downloading the lwc-services, lwc-webpack-plugin and mo-dx-plugin dependency.
Related
I am trying to build a quick interactive Dashboard using react as front-end and data source as Elasticsearch ( Back-end Perl/Node/Any.
To kick start, I need some help/suggestion. Is there any existing React template code to start with.
You may like to checkout MUI Library and their prebuilt dashboards so you can customize and work on them however the prebuilt ones are mostly paid with a couple of free alternatives. Also, note the prebuilt dashboards are made with the nextjs technology.
Here is another one called Ant Design (which I have not personally worked with but seems fairly neat and straightforward)
You could go through this post to see if you find anything you like in here
I would like to generate Typescript React pages or components by using an API and not a CLI tool (like Plop.js) offers for example. The idea is to generate those components from templates based after a tool is run and it should happen behind the scenes without user interacting with the default CLI tools that they usually come in.
Thank you.
You can use http://json2ts.com/ for this issue.
Or also there is package
https://www.npmjs.com/package/json-to-ts
I have come across Hygen and used their setup that was noted down in the Readme to setup an API for generating custom components without interacting with any default CLI tools.
I would like to visualise the components I have used in my project. I have used PHP for the backend and Laravel+Reactjs for the frontend.
What I want to achieve is to understand all the components that depend on each other and how/what they pass to each other.
Is there a way to automatically generate the class/component diagram out of the project in phpstorm or vscode? Can I visualise it on the Chrome's dev tool? Note: I am already using the Chrome dev tool for react component.
You can try dependency-cruiser.
dependency-cruiser can visualise dependencies.
I've used a Google extension called Realize for React for my project, which in the developer tool helps visualize components that appear on a specific route.
But the extension crashes often.
I want to develop a system module based using Laravel 6 and reactjs 16. It will be included Roles and Permissions functionalities.
I am using https://github.com/spatie/laravel-permission for roles permissions. I just want to know how to use it with reactJs.
Laravel 6.0 is being used for database and backend functionalities.
IMHO it's not depending from front-end technologies (like react).
And suggest you to read this article or watch appropriate youtube video.
By the way, I don't think that here we need to write about installation steps for that popular package. Because all that stuff written in the official package Readme, and issues are there too. So if you will get an error, or have some troubles, people will try to help for the specific case
I have an app based on the create-react-app starter kit and need to switch to universal/server rendering due to SEO issues.
Is there an easy way or example of taking the create-react-app teamplate and adding or modifying it to support universal rendering?
A lot of the examples I see for universal are overly complex for my needs and I prefer to keep it very clean and simple, if possible.
Thanks.
EDIT: FYI,
I found this medium post which points at this repository.
Seems simple enough, but since I'm a newbie on all webpack/react/node related stuff, if anyone thinks it's the wrong approach, would love to know...
There was a proof of concept of adding server rendering in this PR.
I can’t speak to how good it is but it’s something you could start with.
You may also look at some of the alternatives.
A few of them provide server rendering out of the box.
I've just created react universal (server-side rendering) starter used recommendations from redux and react-router v4. Fill free for feedback
https://github.com/gzoreslav/react-redux-saga-universal-application
You can take your app (bootstrapped with Create React App) to the next level by replacing react-scripts with a slightly altered version - react-app-tools, which allows adding server-side code to your project (e.g. for server-side rendering purposes and/or implementing an API endpoint). It will allow compiling and running your app using normal Create React App pipeline, using a single instance of Webpack, on the same HTTP port.
You can find more info by visiting React App SDK.