first

.babelrc

@@ -0,0 +1,15 @@
+{
+  "presets": [
+    "next/babel"
+  ],
+  "plugins": [
+    [
+      "babel-plugin-styled-components", 
+      {
+        "ssr": true, 
+        "displayName": true, 
+        "preprocess": false 
+      }
+    ]
+  ]
+}

.eslintrc.js

@@ -0,0 +1,12 @@
+module.exports = {
+  "env": {
+    "browser": true,
+    "node": true,
+  },
+  "extends": ['airbnb'],
+  "rules": {
+    "no-console": "off",
+    "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
+    "camelcase": [0, {properties: "never"}],
+  }
+};

.gitignore

@@ -0,0 +1,19 @@
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+
+# testing
+/coverage
+
+# production
+/build
+/dist
+/.next
+
+# misc
+.DS_Store
+.env
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

README.md

@@ -0,0 +1,55 @@
+# next-react-redux
+
+- [next-react-redux](#next-react-redux)
+  - [Packages](#packages)
+  - [How to start](#how-to-start)
+  - [Directory structure](#directory-structure)
+  - [Eslint config](#eslint-config)
+  - [Font face](#font-face)
+
+## Packages
+
+- eslint
+- next.js
+- React
+- Redux
+- immer
+- Redux saga
+- styled-components
+- next-i18next
+- isomorphic-unfetch
+- pre-commit
+- ...
+
+## How to start
+
+```
+yarn
+yarn dev
+```
+
+## Directory structure
+
+| name       | description                                |
+| ---------- | ------------------------------------------ |
+| pages      | nextjs route page and default setting file |
+| components | Presentational Components                  |
+| containers | Container Components                       |
+| actions    | redux action                               |
+| reducers   | redux reducer                              |
+| apis       | fetch data and send data api               |
+| constants  | and constant ex: style, action             |
+| hoc        | high order component                       |
+| sagas      | redux saga middleware                      |
+| static     | any static file                            |
+
+## Eslint config
+
+eslint-config-airbnb
+
+## Font face
+
+- English: Clear Sans
+- Japanese: Noto Sans Japanese
+- Simplified Chinese: Noto Sans SC
+- Traditional Chinese: Noto Sans TC

apis/index.js

@@ -0,0 +1,6 @@
+import 'isomorphic-unfetch';
+
+export default async () => {
+  const res = await fetch('https://api.github.com/repos/zeit/next.js');
+  return res.json();
+};

components/About.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import styled from 'styled-components';
+
+import { withTranslation } from '../i18n';
+
+const Text = styled.div`
+  padding: 15px;
+  display: inline-block;
+  color: #000;
+  font: 50px menlo, monaco, monospace;
+`;
+
+const About = ({
+  t,
+}) => (
+  <Text>
+    {t('title')}
+  </Text>
+);
+
+About.propTypes = {
+  t: PropTypes.func.isRequired,
+};
+
+export default withTranslation('home')(About);

components/Head.js

@@ -0,0 +1,58 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import NextHead from 'next/head';
+import { withTranslation } from '../i18n';
+
+const defaultOGURL = '';
+const defaultOGImage = '';
+
+const Head = ({
+  t,
+  title,
+  description,
+  url,
+  ogImage,
+}) => (
+  <NextHead>
+    <meta charSet="UTF-8" />
+    <title>{t(title)}</title>
+    <meta
+      name="description"
+      content={t(description)}
+    />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="icon" sizes="192x192" href="/static/touch-icon.png" />
+    <link rel="apple-touch-icon" href="/static/touch-icon.png" />
+    <link rel="mask-icon" href="/static/favicon-mask.svg" color="#49B882" />
+    <link rel="icon" href="/static/favicon.ico" />
+    <meta property="og:url" content={url || defaultOGURL} />
+    <meta property="og:title" content={title || ''} />
+    <meta
+      property="og:description"
+      content={t(description)}
+    />
+    <meta name="twitter:site" content={url || defaultOGURL} />
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:image" content={ogImage || defaultOGImage} />
+    <meta property="og:image" content={ogImage || defaultOGImage} />
+    <meta property="og:image:width" content="1200" />
+    <meta property="og:image:height" content="630" />
+  </NextHead>
+);
+
+Head.propTypes = {
+  t: PropTypes.func.isRequired,
+  title: PropTypes.string,
+  description: PropTypes.string,
+  url: PropTypes.string,
+  ogImage: PropTypes.string,
+};
+
+Head.defaultProps = {
+  title: 'title',
+  description: 'description',
+  url: '',
+  ogImage: '',
+};
+
+export default withTranslation('meta')(Head);

config/configureStore.js

@@ -0,0 +1,32 @@
+import { createStore, applyMiddleware } from 'redux';
+import createSagaMiddleware from 'redux-saga';
+import { composeWithDevTools } from 'redux-devtools-extension';
+
+import rootReducer from '../redux/reducers';
+import rootSaga from '../redux/sagas';
+
+const sagaMiddleware = createSagaMiddleware();
+
+const bindMiddleware = (middleware) => {
+  if (process.env.NODE_ENV !== 'production') {
+    return composeWithDevTools(applyMiddleware(...middleware));
+  }
+  return applyMiddleware(...middleware);
+};
+
+const configureStore = (initialState = {}) => {
+  const store = createStore(
+    rootReducer,
+    initialState,
+    bindMiddleware([sagaMiddleware]),
+  );
+
+  store.runSagaTask = () => {
+    store.sagaTask = sagaMiddleware.run(rootSaga);
+  };
+
+  store.runSagaTask();
+  return store;
+};
+
+export default configureStore;

config/index.js

@@ -0,0 +1,17 @@
+let HOST = 'http://localhost:3000';
+
+switch (process.env.NODE_ENV) {
+  case 'production':
+    HOST = 'http://localhost:3000';
+    break;
+  case 'preparing':
+  case 'test':
+    HOST = 'http://localhost:3000';
+    break;
+  default:
+    break;
+}
+
+module.exports = {
+  HOST,
+};

config/jest.config.js

@@ -0,0 +1,9 @@
+module.exports = {
+  rootDir: '../',
+  transform: {
+    '\\.(js|jsx)?$': 'babel-jest',
+  },
+  testMatch: ['<rootDir>/__test__/(*.)test.{js, jsx}'],
+  moduleFileExtensions: ['js', 'jsx', 'json'],
+  testPathIgnorePatterns: ['<rootDir>/.next/', '<rootDir>/node_modules/'],
+};

constants/actionTypes.js

@@ -0,0 +1,7 @@
+export const ReduxActionTypes = {
+  FETCH_DATA: 'FETCH_DATA',
+  FETCH_DATA_SUC: 'FETCH_DATA_SUC',
+  FETCH_DATA_FAL: 'FETCH_DATA_FAL',
+};
+
+export default ReduxActionTypes;

constants/style.js

@@ -0,0 +1,14 @@
+
+export const mediaRule = {
+  mobileS: '320px',
+  mobileM: '375px',
+  mobileL: '425px',
+  tablet: '768px',
+  laptop: '1024px',
+  desktop: '1440px',
+};
+
+export const theme = {
+  primary: '',
+  secondary: '',
+};

containers/About.js

@@ -0,0 +1,35 @@
+import React, { useEffect } from 'react';
+import PropTypes from 'prop-types';
+import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux';
+
+import {
+  fetchData as fetchDataAction,
+} from '../redux/actions/fetch';
+import About from '../components/About';
+
+const Container = ({
+  fetchData,
+}) => {
+  useEffect(() => {
+    fetchData();
+  }, []);
+
+  return (
+    <About lastUpdate={1111111} />
+  );
+};
+
+Container.propTypes = {
+  fetchData: PropTypes.func.isRequired,
+};
+
+const mapStateToProps = () => ({});
+const mapDispatchToProps = dispatch => ({
+  fetchData: bindActionCreators(fetchDataAction, dispatch),
+});
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps,
+)(Container);

global/styled.js

@@ -0,0 +1,57 @@
+/* eslint-disable consistent-return */
+import { createGlobalStyle, css } from 'styled-components';
+
+export const mediaRule = {
+  mobileS: '320px',
+  mobileM: '375px',
+  mobileL: '425px',
+  tablet: '768px',
+  laptop: '1024px',
+  desktop: '1440px',
+};
+
+export const theme = {
+  primary: '#00bfa5',
+  secondary: '#2d3e4e',
+  success: '#b8e986',
+  error: '#ff3b30',
+  warning: '#ffc107',
+  sicklyGreen: '#8ec31f',
+  normal: '#828282',
+  progress: '#acda33',
+};
+
+export const GlobalStyle = createGlobalStyle`
+  html, body {
+    margin: 0;
+    background-color: #f8f8f8;
+    height: 100%;
+    font-size: 14px;
+
+    & > div {
+      height: 100%;
+    }
+  }
+
+  ${({ lang }) => {
+    if (lang === 'zh-tw') return css`@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC:300,400,700&display=swap');`;
+    if (lang === 'zh-cn') return css`@import url('https://fonts.googleapis.com/css?family=Noto+Sans+SC:300,400,700&display=swap');`;
+    if (lang === 'ja') return css`@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,700&display=swap');`;
+    if (lang === 'en') return css`@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,700&display=swap');`;
+  }}
+  
+  &:lang(en) {
+    font-family: 'Open Sans', sans-serif;
+  }
+  &:lang(zh-tw) {
+    font-family: 'Noto Sans TC', sans-serif;
+  }
+  &:lang(zh-cn) {
+    font-family: 'Noto Sans SC', sans-serif;
+  }
+  &:lang(ja) {
+    font-family: 'Noto Sans JP', sans-serif;
+  }
+`;
+
+export default GlobalStyle;

i18n.js

@@ -0,0 +1,16 @@
+const NextI18Next = require('next-i18next').default;
+
+const NextI18NextInstance = new NextI18Next({
+  defaultNS: 'common',
+  lowerCaseLng: true,
+  localeSubpaths: {
+    en: 'en',
+    'zh-tw': 'zh-tw',
+    'zh-cn': 'zh-cn',
+    ja: 'ja',
+  },
+  defaultLanguage: 'en',
+  otherLanguages: ['zh-tw', 'zh-cn', 'ja'],
+});
+
+module.exports = NextI18NextInstance;

next.config.js

@@ -0,0 +1,13 @@
+// eslint-disable-next-line import/no-extraneous-dependencies
+import webpack from 'webpack';
+
+module.exports = {
+  webpack: (config) => {
+    config.plugins.push(
+      new webpack.DefinePlugin({
+        'process.env.ENV': JSON.stringify(process.env.ENV),
+      }),
+    );
+    return config;
+  },
+};

package.json

@@ -0,0 +1,69 @@
+{
+  "name": "create-next-example-app",
+  "version": "1.0.0",
+  "scripts": {
+    "dev": "babel-node ./server",
+    "build": "yarn build:next && yarn build:server",
+    "build:next": "next build",
+    "build:server": "webpack --config ./server/webpack.config.js",
+    "start": "node .next/server.bundle.js",
+    "export": "npm run build && next export",
+    "lint": "eslint '**/*.js'",
+    "test": "jest --config=./config/jest.config.js"
+  },
+  "pre-commit": [
+    "lint"
+  ],
+  "dependencies": {
+    "@loadable/component": "^5.10.3",
+    "babel-plugin-inline-react-svg": "^1.0.1",
+    "body-parser": "^1.18.3",
+    "compression": "^1.7.4",
+    "cookie-parser": "^1.4.3",
+    "express": "^4.17.1",
+    "express-session": "^1.15.6",
+    "immer": "^5.0.0",
+    "isomorphic-unfetch": "^3.0.0",
+    "js-cookie": "^2.2.0",
+    "mobile-detect": "^1.4.3",
+    "morgan": "^1.9.1",
+    "next": "^9.1.2",
+    "next-i18next": "^2.0.0",
+    "next-redux-saga": "^3.0.0",
+    "next-redux-wrapper": "^2.0.0",
+    "prop-types": "^15.6.2",
+    "react": "16.10.0",
+    "react-dom": "16.10.0",
+    "react-redux": "^7.1.1",
+    "redux": "^4.0.0",
+    "redux-devtools-extension": "^2.13.5",
+    "redux-saga": "^1.1.1",
+    "styled-components": "4.4.0"
+  },
+  "license": "MIT",
+  "devDependencies": {
+    "@babel/node": "^7.2.2",
+    "@testing-library/jest-dom": "^4.2.3",
+    "@testing-library/react": "^9.3.2",
+    "babel-eslint": "^10.0.1",
+    "babel-jest": "^25.0.0",
+    "babel-plugin-styled-components": "^1.7.1",
+    "eslint": "^5.6.0",
+    "eslint-config-airbnb": "^17.1.0",
+    "eslint-plugin-import": "^2.14.0",
+    "eslint-plugin-jsx-a11y": "^6.1.1",
+    "eslint-plugin-react": "^7.11.1",
+    "eslint-plugin-react-hooks": "^2.2.0",
+    "jest": "^25.0.0",
+    "jest-styled-components": "^6.2.1",
+    "pre-commit": "^1.2.2",
+    "react-test-renderer": "^16.5.2",
+    "secure-env": "^1.2.0",
+    "webpack": "^4.29.6",
+    "webpack-cli": "^3.2.3",
+    "webpack-node-externals": "^1.7.2"
+  },
+  "engines": {
+    "node": ">=10.0.0"
+  }
+}

pages/_app.js

@@ -0,0 +1,38 @@
+import App from 'next/app';
+import React from 'react';
+import { Provider } from 'react-redux';
+import withRedux from 'next-redux-wrapper';
+import withReduxSaga from 'next-redux-saga';
+import loadable from '@loadable/component';
+import { i18n, appWithTranslation } from '../i18n';
+
+import createStore from '../config/configureStore';
+
+const GlobalStyle = loadable(() => import('../global/styled'));
+
+class MainApp extends App {
+  static async getInitialProps({ Component, ctx }) {
+    let pageProps = {};
+
+    if (Component.getInitialProps) {
+      pageProps = await Component.getInitialProps({ ctx });
+    }
+
+    return { pageProps };
+  }
+
+  render() {
+    const {
+      Component, pageProps, store,
+    } = this.props;
+
+    return (
+      <Provider store={store}>
+        <GlobalStyle lang={i18n.language} />
+        <Component {...pageProps} />
+      </Provider>
+    );
+  }
+}
+
+export default withRedux(createStore)(withReduxSaga({ async: true })(appWithTranslation(MainApp)));

pages/_document.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import Document, { Head, Main, NextScript } from 'next/document';
+import { ServerStyleSheet } from 'styled-components';
+import { i18n } from '../i18n';
+
+class MyDocument extends Document {
+  static getInitialProps({ renderPage }) {
+    const sheet = new ServerStyleSheet();
+    const page = renderPage(App => props => sheet.collectStyles(<App {...props} />));
+    const styleTags = sheet.getStyleElement();
+    return { ...page, styleTags };
+  }
+
+  render() {
+    return (
+      <html lang={i18n.language}>
+        <Head>
+          <link rel="shortcut icon" type="image/x-icon" href="/static/favicon.ico" />
+          {this.props.styleTags}
+        </Head>
+        <body>
+          <Main />
+          <NextScript />
+        </body>
+      </html>
+    );
+  }
+}
+
+export default MyDocument;

pages/demo.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const demo = props => {
+  return (
+    <iframe
+      style={{ width: '100%', height: '100%' }}
+      src="https://preparing2.kdanmobile.com:3024/pdf?preview_token=cb8d0d8b15fcdaac47751de82a95f882"
+    />
+  );
+};
+
+demo.propTypes = {
+  
+};
+
+export default demo;

pages/index.js

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import About from '../containers/About';
+
+const Home = () => (
+  <About />
+);
+
+Home.getInitialProps = async () => ({
+  namespacesRequired: ['home'],
+});
+
+export default Home;

redux/actions/fetch.js

@@ -0,0 +1,7 @@
+import { ReduxActionTypes } from '../../constants/actionTypes';
+
+export const fetchData = () => ({
+  type: ReduxActionTypes.FETCH_DATA,
+});
+
+export default fetchData;

redux/reducers/fetch.js

@@ -0,0 +1,29 @@
+/* eslint-disable no-param-reassign */
+import produce from 'immer';
+import { ReduxActionTypes } from '../../constants/actionTypes';
+
+export const initialState = {
+  data: {},
+  isLoading: false,
+  error: false,
+};
+
+const clock = (state = initialState, action) => (
+  produce(state, (draft) => {
+    switch (action.type) {
+      case ReduxActionTypes.FETCH_DATA:
+        draft.isLoading = true;
+        break;
+      case ReduxActionTypes.FETCH_DATA_SUC:
+        draft.isLoading = false;
+        break;
+      case ReduxActionTypes.FETCH_DATA_FAL:
+        draft.isLoading = false;
+        break;
+      default:
+        break;
+    }
+  })
+);
+
+export default clock;

redux/reducers/index.js

@@ -0,0 +1,8 @@
+import { combineReducers } from 'redux';
+import fetch from './fetch';
+
+const rootReducer = combineReducers({
+  fetch,
+});
+
+export default rootReducer;

redux/sagas/fetch.js

@@ -0,0 +1,18 @@
+import {
+  call,
+  put,
+} from 'redux-saga/effects';
+
+import { ReduxActionTypes } from '../../constants/actionTypes';
+import callApi from '../../apis';
+
+function* runClockSaga() {
+  const data = yield call(callApi);
+  if (data) {
+    yield put({ type: ReduxActionTypes.FETCH_DATA_SUC });
+  } else {
+    yield put({ type: ReduxActionTypes.FETCH_DATA_FAL });
+  }
+}
+
+export default runClockSaga;

redux/sagas/index.js

@@ -0,0 +1,13 @@
+import {
+  all,
+} from 'redux-saga/effects';
+
+import fetchSaga from './fetch';
+
+function* rootSage() {
+  yield all([
+    fetchSaga(),
+  ]);
+}
+
+export default rootSage;

server/api/index.js

@@ -0,0 +1,19 @@
+import express from 'express';
+const router = express.Router();
+
+router.post('/register', (req, res) => {
+  internalApi.memberRegister(req.body, req.headers.host)
+    .then((result) => {
+      if (result.message === 'create member success') {
+        res.status(200);
+        res.json({ status: 'success', message: 'create member success' });
+      } else {
+        res.status(400);
+        res.json({ status: 'error', message: result.message });
+      }
+    })
+    .catch((error) => {
+      res.status(400);
+      res.json({ status: 'error', message: error.message });
+    });
+});

server/index.js

@@ -0,0 +1,43 @@
+import express from 'express';
+import next from 'next';
+import compression from 'compression';
+import morgan from 'morgan';
+import nextI18NextMiddleware from 'next-i18next/middleware';
+import cookieParser from 'cookie-parser';
+import bodyParser from 'body-parser';
+
+import nextI18next from '../i18n';
+import customRoute from './route';
+
+const isDev = process.env.ENV !== 'production' && process.env.ENV !== 'preparing';
+const app = next({ dev: isDev });
+const handle = app.getRequestHandler();
+
+(async () => {
+  await app.prepare();
+  const server = express();
+
+  server.use(compression());
+  server.use(cookieParser());
+  if (isDev) {
+    server.use(morgan('short'));
+  }
+  server.use(bodyParser.json());
+  server.use(bodyParser.urlencoded({ extended: true }));
+
+  server.use(nextI18NextMiddleware(nextI18next));
+
+  customRoute(server, app, handle);
+
+  server.get('*', (req, res) => {
+    handle(req, res);
+  });
+
+  await server.listen(3000);
+  /* eslint-disable no-console */
+  if (isDev) {
+    console.log('> Ready on http://localhost:3000');
+  } else {
+    console.log('> Ready on production');
+  }
+})();

server/route.js

@@ -0,0 +1,7 @@
+const router = (server, app, handle) => {
+  server.get('/', (req, res) => {
+    handle(req, res);
+  });
+};
+
+export default router;

server/webpack.config.js

@@ -0,0 +1,18 @@
+const path = require('path');
+const nodeExternals = require('webpack-node-externals');
+const webpack = require('webpack');
+
+module.exports = {
+  target: 'node',
+  entry: './server/index',
+  output: {
+    path: path.resolve(__dirname, '../.next'),
+    filename: 'server.bundle.js',
+  },
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
+    }),
+  ],
+  externals: [nodeExternals()],
+};

static/locales/en/about.json

@@ -0,0 +1,11 @@
+{
+  "title": "about next.js",
+  "description": "about next.js description",
+  "welcome": "about to next.js",
+  "sample_test": "test words for en",
+  "sample_button": "fire in the wind for en",
+  "link": {
+    "gotoPage2": "Go to page 2",
+    "gotoPage3": "Go to page 3 (no hoc)"
+  }
+}

static/locales/en/home.json

@@ -0,0 +1,11 @@
+{
+  "title": "welcome next.js",
+  "description": "next.js description",
+  "welcome": "welcome to next.js",
+  "sample_test": "test words for en",
+  "sample_button": "fire in the wind for en",
+  "link": {
+    "gotoPage2": "Go to page 2",
+    "gotoPage3": "Go to page 3 (no hoc)"
+  }
+}

static/locales/en/meta.json

@@ -0,0 +1,4 @@
+{
+  "title": "title",
+  "description": "description"
+}

static/locales/ja/about.json

@@ -0,0 +1,11 @@
+{
+  "title": "about next.js",
+  "description": "about next.js description",
+  "welcome": "about to next.js",
+  "sample_test": "test words for en",
+  "sample_button": "fire in the wind for en",
+  "link": {
+    "gotoPage2": "Go to page 2",
+    "gotoPage3": "Go to page 3 (no hoc)"
+  }
+}

static/locales/ja/home.json

@@ -0,0 +1,11 @@
+{
+  "title": "welcome next.js",
+  "description": "next.js description",
+  "welcome": "welcome to next.js",
+  "sample_test": "test words for en",
+  "sample_button": "fire in the wind for en",
+  "link": {
+    "gotoPage2": "Go to page 2",
+    "gotoPage3": "Go to page 3 (no hoc)"
+  }
+}

static/locales/ja/meta.json

@@ -0,0 +1,4 @@
+{
+  "title": "title",
+  "description": "description"
+}

static/locales/zh-cn/about.json

@@ -0,0 +1,11 @@
+{
+  "title": "關於 next.js",
+  "description": "關於 next.js 介紹",
+  "welcome": "關於",
+  "sample_test": "test words for en",
+  "sample_button": "fire in the wind for en",
+  "link": {
+    "gotoPage2": "Go to page 2",
+    "gotoPage3": "Go to page 3 (no hoc)"
+  }
+}

static/locales/zh-cn/home.json

@@ -0,0 +1,11 @@
+{
+  "title": "歡迎來到 next.js",
+  "description": "next.js 介紹",
+  "welcome": "歡迎來到 next.js",
+  "sample_test": "test words for en",
+  "sample_button": "fire in the wind for en",
+  "link": {
+    "gotoPage2": "Go to page 2",
+    "gotoPage3": "Go to page 3 (no hoc)"
+  }
+}

static/locales/zh-cn/meta.json

@@ -0,0 +1,4 @@
+{
+  "title": "標題",
+  "description": "介紹"
+}

static/locales/zh-tw/about.json

@@ -0,0 +1,11 @@
+{
+  "title": "關於 next.js",
+  "description": "關於 next.js 介紹",
+  "welcome": "關於",
+  "sample_test": "test words for en",
+  "sample_button": "fire in the wind for en",
+  "link": {
+    "gotoPage2": "Go to page 2",
+    "gotoPage3": "Go to page 3 (no hoc)"
+  }
+}

static/locales/zh-tw/home.json

@@ -0,0 +1,11 @@
+{
+  "title": "歡迎來到 next.js",
+  "description": "next.js 介紹",
+  "welcome": "歡迎來到 next.js",
+  "sample_test": "test words for en",
+  "sample_button": "fire in the wind for en",
+  "link": {
+    "gotoPage2": "Go to page 2",
+    "gotoPage3": "Go to page 3 (no hoc)"
+  }
+}

static/locales/zh-tw/meta.json

@@ -0,0 +1,4 @@
+{
+  "title": "標題",
+  "description": "介紹"
+}