Setting up your local dev server
Install frappe-react-sdk
npm install frappe-react-sdk
or
yarn add frappe-react-sdk
Initialising the library
To get started, initialise the library by wrapping your App with the FrappeProvider. You can optionally provide the URL of your Frappe server if the web app is not hosted on the same URL.
In App.tsx
or App.jsx
:
import { FrappeProvider } from "frappe-react-sdk";
function App() {
/** The URL is an optional parameter. Only use it if the Frappe server is hosted on a separate URL **/
return (
<FrappeProvider url='https://my-frappe-server.frappe.cloud'>
{/** Your other app components **/}
</FrappeProvider>
)
}
In case you want to use the library with token based authentication (OAuth bearer tokens or API key/secret pairs), you can initialise the library like this:
import { FrappeProvider } from "frappe-react-sdk";
function App() {
/** The URL is an optional parameter. Only use it if the Frappe server is hosted on a separate URL **/
return (
<FrappeProvider url='https://my-frappe-server.frappe.cloud' tokenParams={
useToken: true,
// Pass a custom function that returns the token as a string - this could be fetched from LocalStorage or auth providers like Firebase, Auth0 etc.
token: getTokenFromLocalStorage(),
// This can be "Bearer" or "token"
type: "Bearer"
} >
{/** Your other app components **/}
</FrappeProvider>
);
}