Treats

Treats

  • Getting Started

›Main Concepts

Getting Started

  • Installation

Tutorial

  • 01. Creating Your First Page
  • 02. Using Redux
  • 03. Using GraphQL
  • 04. Fetch Data for SSR
  • 05. Adding Addons

Main Concepts

  • Overview
  • Routing
  • Localization
  • Code-splitting
  • Redux
  • GraphQL Client
  • Middlewares
  • Helpers
  • Server-side Events
  • Server-side Template
  • Server-side Rendering
  • Custom Server App
  • Custom Client Initialization
  • Custom React App
  • Runtime Config
  • Build Config
  • Environment Variables
  • Code Generator
  • Scripts
  • Addons
  • Typescript
  • Workbox

API Reference

  • Overview
  • Filesystem Hooks
  • Components
  • Server
  • Client
  • Router
  • Intl
  • Locale Data
  • Helmet
  • Redux
  • Graphql

Authoring Addons

  • Overview
  • Helpers
  • Middlewares
  • Generators
  • Wrapping Up

Addons

  • Treats Addons List

Contributing

  • How To Contribute

FAQ

  • FAQs

Custom React App

To provide custom React app, we can use src/_app/index.js filesystem hooks, please note that for now, by providing custom React app, you'll need to handle routing by yourself, you can import routes from @treats/route.

import React, { Component } from "react";
import { Helmet } from "@treats/helmet";
import { Route, Switch } from "@treats/router";
import routes from "@treats/route";

class App extends Component {
    render() {
        const { language } = this.props;
        return (
            <div id="my-custom-app">
                <Helmet>
                    <html lang={language} />
                </Helmet>
                <Switch>
                    {routes.map(entry => (
                        <Route key={entry.path} {...entry} />
                    ))}
                </Switch>  
            </div> 
        )
    }
}

export default App;
← Custom Client InitializationRuntime Config →
Tokopedia Open Source
Copyright © 2019 Tokopedia OSS