[FEATURE] - add seo for homepage, seo util, needed for ssr acceptance…

… test

src/react_router/react_router.js

@@ -15,6 +15,7 @@ import RepoDetailPage from '../views/containers/pages/repo_detail_page/repo_deta
 import repoDetailStateManager from './route_state_managers/repo_detail_state_manager';
 import notFoundStateManager from './route_state_managers/not_found_state_manager';
 import searchResultsStateManager from './route_state_managers/search_results_state_manager';
+import homepageStateManager from './route_state_managers/homepage_state_manager';
 
 function logPageView() {
   if (canUseDOM) {
@@ -50,6 +51,7 @@ export default function giveRoutesHystoryAndStore(history, store) {
       <Route path="/" component={Layout}>
         <IndexRoute
           component={IndexPage}
+          onEnter={homepageStateManager(store)}
         />
         <Route
           path="/about"

src/react_router/route_state_managers/homepage_state_manager.js

@@ -0,0 +1,23 @@
+import { canUseDOM } from 'exenv';
+import asyncHomepageAction from '../../redux/actions/async_homepage_actions';
+
+export default function fetchDataWithStore(store) {
+  return function fetchData(nextState, replace, callback) {
+    const { dispatch } = store;
+    // run async
+    if (canUseDOM) {
+      if (store.getState().config.initialPageLoad === true) {
+        return callback();
+      }
+      asyncHomepageAction(nextState.params)(dispatch);
+      return callback();
+    }
+    // run sync
+    return asyncHomepageAction(nextState.params)(dispatch)
+      .then(callback)
+      .catch(function handleActionError() {
+        // log error
+        callback();
+      });
+  };
+}

src/redux/action_creators/homepage_action_creators.js

@@ -0,0 +1,7 @@
+export default function homepageLoaded(data = {}) {
+  return {
+    type: 'HOMEPAGE_LOADED',
+    data
+  };
+}
+

src/redux/actions/async_homepage_actions.js

@@ -0,0 +1,9 @@
+import P from 'bluebird';
+import homepageLoaded from './../action_creators/homepage_action_creators';
+
+export default function fetchHomepageAction(params) {
+  return function firstDispatch(dispatch) {
+    dispatch(homepageLoaded(params));
+    return P.resolve();
+  };
+}

src/redux/reducers/homepage_reducer.js

@@ -0,0 +1,18 @@
+// https://github.com/reactjs/redux/issues/99
+// import { canUseDOM } from 'exenv';
+
+export default function (state = {}, action) {
+  const typeMap = {
+    HOMEPAGE_LOADED() {
+      return {
+        isLoading: false
+      };
+    }
+  };
+
+  if (typeMap[action.type]) {
+    return typeMap[action.type]();
+  }
+
+  return state;
+}

src/redux/reducers/index.js

@@ -6,12 +6,14 @@ import metaReducer from './meta_reducer';
 import statusReducer from './status_reducer';
 import repoDetailReducer from './repo_detail_reducer';
 import searchResultsReducer from './search_results_reducer';
+import homepageReducer from './homepage_reducer';
 
 export default combineReducers({
   routing: routerReducer,
   config: configReducer,
   meta: metaReducer,
   status: statusReducer,
+  homepage: homepageReducer,
   repoDetail: repoDetailReducer,
   search: searchResultsReducer
 });

src/redux/reducers/meta_reducer.js

@@ -1,88 +1,16 @@
-import { get } from 'lodash';
-
-function getMetaRepo(action) {
-  return {
-    title: `${get(action, 'repo.name')} - ${get(action, 'repo.description')}`,
-    meta: [
-      { charSet: 'utf-8' },
-      { name: 'viewport', content: 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' },
-      { name: 'subject', content: '' },
-      { name: 'description', content: `${get(action, 'repo.description')}` },
-      { name: 'keywords', content: '' },
-      { name: 'news_keywords', content: '' },
-      { name: 'revised', content: '' },
-      { name: 'distribution', content: '' },
-      { name: 'topic', content: '' },
-      { name: 'summary', content: '' },
-      { name: 'category', content: '' },
-      { name: 'coverage', content: '' },
-      { name: 'robots', content: '' },
-      { name: 'googlebot', content: '' },
-      { name: 'application-name', content: '' },
-      { name: 'language', content: '' },
-      { name: 'rating', content: '' },
-
-      { name: 'twitter:card', content: '' },
-      { name: 'twitter:url', content: '' },
-      { name: 'twitter:title', content: '' },
-      { name: 'twitter:description', content: `${get(action, 'repo.description')}` },
-      { name: 'twitter:image', content: `${get(action, 'repo.owner.avatar_url')}` },
-      { name: 'twitter:site', content: '' },
-      { name: 'twitter:creator', content: '' },
-
-      { name: 'skype_toolbar', content: '' },
-      { name: 'google-site-verification', content: '' },
-      { name: 'p:domain_verify', content: '' },
-      { name: 'yandex-verification', content: '' },
-      { name: 'msvalidate.01', content: '' },
-      { name: 'msapplication-TileColor', content: '' },
-      { name: 'msapplication-TileImage', content: '' },
-      { name: 'theme-color', content: '' },
-
-      { property: 'fb:app_id', content: '' },
-      { property: 'fb:pages', content: '' },
-      { property: 'fb:pages', content: '' },
-      { property: 'og:url', content: '' },
-      { property: 'og:title', content: '' },
-      { property: 'og:image', content: '' },
-      { property: 'og:description', content: `${get(action, 'repo.description')}` },
-      { property: 'og:type', content: '' },
-      { property: 'og:site_name', content: '' },
-      { property: 'og:locale', content: '' },
-      { property: 'og:title', content: '' },
-      { property: 'op:markup_version', content: '' },
-      { property: 'fb:article_style', content: '' },
-
-      { itemProp: 'name', content: '' },
-      { itemProp: 'description', content: `${get(action, 'repo.description')}` },
-      { itemProp: 'image', content: `${get(action, 'repo.owner.avatar_url')}` },
-      { httpEquiv: 'refresh', content: '' },
-      { httpEquiv: 'x-ua-compatible', content: '' },
-      { httpEquiv: 'cleartype', content: '' }
-    ],
-    link: [
-      { rel: 'dns-prefetch', href: '' },
-      { rel: 'shortcut-icon', href: '' },
-      { rel: 'alternate', type: 'application/rss+xml', title: '', href: '' },
-      { rel: 'canonical', href: '' },
-      { rel: 'publisher', href: '' },
-      { rel: 'image_src', href: `${get(action, 'repo.owner.avatar_url')}` },
-      { rel: 'apple-touch-icon', sizes: '', href: '' },
-      { rel: 'icon', type: 'image/png', sizes: '', href: '' },
-      { rel: 'manifest', href: '' }
-    ],
-    script: [{ type: 'application/ld+json', innerHTML: '{ \'@context\': \'http://schema.org\' }' }],
-    noscript: [],
-    style: []
-  };
-}
+import repoDetailSeoUtil from '../../utils/seo_utils/repo_seo_util';
+import homepageSeoUtil from '../../utils/seo_utils/homepage_seo_util';
 
 export default function (state = {}, action) {
   const { type } = action;
 
   const typeMap = {
+    HOMEPAGE_LOADED(act) {
+      return homepageSeoUtil(act);
+    },
+
     REPO_DETAIL_LOADED(act) {
-      return getMetaRepo(act);
+      return repoDetailSeoUtil(act);
     },
 
     SEARCH_LOADED() {

src/utils/seo_utils/homepage_seo_util.js

@@ -0,0 +1,76 @@
+// import { get } from 'lodash';
+
+export default function homepageSEO(/* action */) {
+  return {
+    title: 'react-ssr-spa - an simple example repo of server side rendering in react',
+    meta: [
+      { charSet: 'utf-8' },
+      { name: 'viewport', content: 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' },
+      { name: 'subject', content: '' },
+      { name: 'description', content: 'render server side react' },
+      { name: 'keywords', content: '' },
+      { name: 'news_keywords', content: '' },
+      { name: 'revised', content: '' },
+      { name: 'distribution', content: '' },
+      { name: 'topic', content: '' },
+      { name: 'summary', content: '' },
+      { name: 'category', content: '' },
+      { name: 'coverage', content: '' },
+      { name: 'robots', content: '' },
+      { name: 'googlebot', content: '' },
+      { name: 'application-name', content: '' },
+      { name: 'language', content: '' },
+      { name: 'rating', content: '' },
+
+      { name: 'twitter:card', content: '' },
+      { name: 'twitter:url', content: '' },
+      { name: 'twitter:title', content: '' },
+      { name: 'twitter:description', content: '' },
+      { name: 'twitter:image', content: '' },
+      { name: 'twitter:site', content: '' },
+      { name: 'twitter:creator', content: '' },
+
+      { name: 'skype_toolbar', content: '' },
+      { name: 'google-site-verification', content: '' },
+      { name: 'p:domain_verify', content: '' },
+      { name: 'yandex-verification', content: '' },
+      { name: 'msvalidate.01', content: '' },
+      { name: 'msapplication-TileColor', content: '' },
+      { name: 'msapplication-TileImage', content: '' },
+      { name: 'theme-color', content: '' },
+
+      { property: 'fb:app_id', content: '' },
+      { property: 'fb:pages', content: '' },
+      { property: 'og:url', content: '' },
+      { property: 'og:title', content: '' },
+      { property: 'og:image', content: '' },
+      { property: 'og:description', content: '' },
+      { property: 'og:type', content: '' },
+      { property: 'og:site_name', content: '' },
+      { property: 'og:locale', content: '' },
+      { property: 'op:markup_version', content: '' },
+      { property: 'fb:article_style', content: '' },
+
+      { itemProp: 'name', content: '' },
+      { itemProp: 'description', content: '' },
+      { itemProp: 'image', content: '' },
+      { httpEquiv: 'refresh', content: '' },
+      { httpEquiv: 'x-ua-compatible', content: '' },
+      { httpEquiv: 'cleartype', content: '' }
+    ],
+    link: [
+      { rel: 'dns-prefetch', href: '' },
+      { rel: 'shortcut-icon', href: '' },
+      { rel: 'alternate', type: 'application/rss+xml', title: '', href: '' },
+      { rel: 'canonical', href: '' },
+      { rel: 'publisher', href: '' },
+      { rel: 'image_src', href: '' },
+      { rel: 'apple-touch-icon', sizes: '', href: '' },
+      { rel: 'icon', type: 'image/png', sizes: '', href: '' },
+      { rel: 'manifest', href: '' }
+    ],
+    script: [{ type: 'application/ld+json', innerHTML: '{ \'@context\': \'http://schema.org\' }' }],
+    noscript: [],
+    style: []
+  };
+}

src/utils/seo_utils/repo_seo_util.js

@@ -0,0 +1,76 @@
+import { get } from 'lodash';
+
+export default function repoSEO(action) {
+  return {
+    title: `${get(action, 'repo.name')} - ${get(action, 'repo.description')}`,
+    meta: [
+      { charSet: 'utf-8' },
+      { name: 'viewport', content: 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' },
+      { name: 'subject', content: '' },
+      { name: 'description', content: `${get(action, 'repo.description')}` },
+      { name: 'keywords', content: '' },
+      { name: 'news_keywords', content: '' },
+      { name: 'revised', content: '' },
+      { name: 'distribution', content: '' },
+      { name: 'topic', content: '' },
+      { name: 'summary', content: '' },
+      { name: 'category', content: '' },
+      { name: 'coverage', content: '' },
+      { name: 'robots', content: '' },
+      { name: 'googlebot', content: '' },
+      { name: 'application-name', content: '' },
+      { name: 'language', content: '' },
+      { name: 'rating', content: '' },
+
+      { name: 'twitter:card', content: '' },
+      { name: 'twitter:url', content: '' },
+      { name: 'twitter:title', content: '' },
+      { name: 'twitter:description', content: `${get(action, 'repo.description')}` },
+      { name: 'twitter:image', content: `${get(action, 'repo.owner.avatar_url')}` },
+      { name: 'twitter:site', content: '' },
+      { name: 'twitter:creator', content: '' },
+
+      { name: 'skype_toolbar', content: '' },
+      { name: 'google-site-verification', content: '' },
+      { name: 'p:domain_verify', content: '' },
+      { name: 'yandex-verification', content: '' },
+      { name: 'msvalidate.01', content: '' },
+      { name: 'msapplication-TileColor', content: '' },
+      { name: 'msapplication-TileImage', content: '' },
+      { name: 'theme-color', content: '' },
+
+      { property: 'fb:app_id', content: '' },
+      { property: 'fb:pages', content: '' },
+      { property: 'og:url', content: '' },
+      { property: 'og:title', content: '' },
+      { property: 'og:image', content: '' },
+      { property: 'og:description', content: `${get(action, 'repo.description')}` },
+      { property: 'og:type', content: '' },
+      { property: 'og:site_name', content: '' },
+      { property: 'og:locale', content: '' },
+      { property: 'op:markup_version', content: '' },
+      { property: 'fb:article_style', content: '' },
+
+      { itemProp: 'name', content: '' },
+      { itemProp: 'description', content: `${get(action, 'repo.description')}` },
+      { itemProp: 'image', content: `${get(action, 'repo.owner.avatar_url')}` },
+      { httpEquiv: 'refresh', content: '' },
+      { httpEquiv: 'x-ua-compatible', content: '' },
+      { httpEquiv: 'cleartype', content: '' }
+    ],
+    link: [
+      { rel: 'dns-prefetch', href: '' },
+      { rel: 'shortcut-icon', href: '' },
+      { rel: 'alternate', type: 'application/rss+xml', title: '', href: '' },
+      { rel: 'canonical', href: '' },
+      { rel: 'publisher', href: '' },
+      { rel: 'image_src', href: `${get(action, 'repo.owner.avatar_url')}` },
+      { rel: 'apple-touch-icon', sizes: '', href: '' },
+      { rel: 'icon', type: 'image/png', sizes: '', href: '' },
+      { rel: 'manifest', href: '' }
+    ],
+    script: [{ type: 'application/ld+json', innerHTML: '{ \'@context\': \'http://schema.org\' }' }],
+    noscript: [],
+    style: []
+  };
+}