Skip to content

Commit 0f3173a

Browse files
committed
Add footer, analytics, readme and license.
1 parent ab27658 commit 0f3173a

File tree

9 files changed

+207
-4
lines changed

9 files changed

+207
-4
lines changed

LICENSE.md

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2018 Atyantik Technologies Private Limited
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

README.md

+60
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
[![Join the chat at https://gitter.im/react-pwa](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/react-pwa/Lobby?utm_source=share-link&utm_medium=link&utm_campaign=share-link)
2+
3+
4+
<h1 align="center" style="text-align:center">ReactPWA - PawJS & Redux</h1>
5+
6+
7+
Example repository for integrating REDUX with ReactPWA project. This repo demonstrates the usage & integration of Redux in existing ReactPWA project using Redux.
8+
9+
10+
### Getting Started
11+
12+
##### 1. Clone the repo to your local PC and go to the installation
13+
```bash
14+
git clone https://github.com/Atyantik/example-pawjs-redux.git reactpwa-redux && cd reactpwa-redux
15+
```
16+
17+
##### 2. Install the dependencies
18+
```bash
19+
npm install
20+
```
21+
22+
##### 2. Start the demo project
23+
```bash
24+
npm start
25+
```
26+
27+
### Redux
28+
Visit [Redux](https://redux.js.org/) for more details & documentation on Redux
29+
30+
### ReactPWA
31+
ReactPWA is a highly scalable, Progressive Web Application foundation, boilerplate, with the best Developer Experience built on top of PawJS
32+
Visit [ReactPWA](https://www.reactpwa.com) for more configuration & documentation.
33+
34+
### Backers
35+
Thank you to all our backers! 🙏 [[Become a backer](https://opencollective.com/react-pwa#backer)]
36+
<a href="https://opencollective.com/react-pwa#backers" target="_blank"><img src="https://opencollective.com/react-pwa/backers.svg?width=890"></a>
37+
38+
39+
### Sponsors
40+
Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [[Become a sponsor](https://opencollective.com/react-pwa#sponsor)]
41+
42+
<a href="https://opencollective.com/react-pwa/sponsor/0/website" target="_blank"><img src="https://opencollective.com/react-pwa/sponsor/0/avatar.svg"></a>
43+
<a href="https://opencollective.com/react-pwa/sponsor/1/website" target="_blank"><img src="https://opencollective.com/react-pwa/sponsor/1/avatar.svg"></a>
44+
<a href="https://opencollective.com/react-pwa/sponsor/2/website" target="_blank"><img src="https://opencollective.com/react-pwa/sponsor/2/avatar.svg"></a>
45+
<a href="https://opencollective.com/react-pwa/sponsor/3/website" target="_blank"><img src="https://opencollective.com/react-pwa/sponsor/3/avatar.svg"></a>
46+
<a href="https://opencollective.com/react-pwa/sponsor/4/website" target="_blank"><img src="https://opencollective.com/react-pwa/sponsor/4/avatar.svg"></a>
47+
<a href="https://opencollective.com/react-pwa/sponsor/5/website" target="_blank"><img src="https://opencollective.com/react-pwa/sponsor/5/avatar.svg"></a>
48+
<a href="https://opencollective.com/react-pwa/sponsor/6/website" target="_blank"><img src="https://opencollective.com/react-pwa/sponsor/6/avatar.svg"></a>
49+
<a href="https://opencollective.com/react-pwa/sponsor/7/website" target="_blank"><img src="https://opencollective.com/react-pwa/sponsor/7/avatar.svg"></a>
50+
<a href="https://opencollective.com/react-pwa/sponsor/8/website" target="_blank"><img src="https://opencollective.com/react-pwa/sponsor/8/avatar.svg"></a>
51+
<a href="https://opencollective.com/react-pwa/sponsor/9/website" target="_blank"><img src="https://opencollective.com/react-pwa/sponsor/9/avatar.svg"></a>
52+
53+
### Supporters
54+
##### Atyantik Technologies Private Limited
55+
Everyone at Atyantik Technologies is contributing their free time for contributing to the project and core discussions.
56+
<a href="https://www.atyantik.com" target="_blank"><img width="150px" src="https://www.reactpwa.com/img/supporters/atyantik.svg"></a>
57+
58+
59+
### License
60+
This project is licensed under the MIT license, Copyright (c) 2018 [Atyantik Technologies Private Limited](https://www.atyantik.com). For more information see [LICENSE.md]("https://github.com/Atyantik/example-pawjs-redux/blob/master/LICENSE.md").

src/app/components/home/home.css

+34-1
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
}
1010
.btn {
1111
margin: 18px;
12-
background-color: #008CBA;
12+
background-color: #308CBA;
1313
border: none;
1414
padding: 12px 28px;
1515
color: #ffffff;
@@ -32,6 +32,12 @@
3232
max-width: 500px;
3333
margin: 0 auto;
3434
}
35+
.mw800{
36+
max-width: 800px;
37+
margin: 0 auto;
38+
margin-top: 2rem;
39+
border-top: 1px solid #000;
40+
}
3541
.col12{
3642
width: 100%;
3743
float: left;
@@ -42,22 +48,49 @@
4248
float: left;
4349
text-align: right;
4450
}
51+
.col8{
52+
width: 60%;
53+
float: left;
54+
}
55+
.col4{
56+
width: 40%;
57+
float: left;
58+
}
4559
.col6md{
4660
width: 50%;
4761
float: left;
4862
}
63+
.p1 {
64+
padding: 1rem;
65+
}
66+
.p2 {
67+
padding: 2rem 0;
68+
}
4969
.mt{
5070
margin-top: 3rem;
5171
}
5272
.black{
5373
background-color: black;
5474
text-decoration: none;
5575
}
76+
.link{
77+
text-decoration: none;
78+
color: #308CBA;
79+
font-weight: 600;
80+
}
5681
@media (max-width: 575px) {
5782
.col6{
5883
width: 100%;
5984
text-align: center;
6085
}
86+
.col4{
87+
width: 100%;
88+
text-align: center;
89+
}
90+
.col8{
91+
width: 100%;
92+
text-align: center;
93+
}
6194
.value{
6295
font-size: 100px;
6396
}

src/app/components/home/home.js

+56-2
Original file line numberDiff line numberDiff line change
@@ -56,8 +56,8 @@ class Home extends Component {
5656
</div>
5757
<div className={styles.col12}>
5858
<div>
59-
<button type="button" onClick={e => this.incrementCounter(e)} className={styles.btn}>
60-
Increment Counter
59+
<button type="button" onClick={e => this.decrementCounter(e)} className={styles.btn}>
60+
Decrement Counter
6161
</button>
6262
</div>
6363
</div>
@@ -80,6 +80,60 @@ class Home extends Component {
8080
View source code
8181
</a>
8282
</div>
83+
<div className={styles.mw800}>
84+
<div className={styles.row}>
85+
<div className={styles.col8}>
86+
<div className={styles.p2}>
87+
<div>
88+
This is an example project of implementing Redux (Saga) with&nbsp;
89+
<a
90+
href="https://www.reactpwa.com"
91+
target="_blank"
92+
rel="noopener nofollow noreferrer"
93+
className={styles.link}
94+
>
95+
ReactPWA boilerplate
96+
</a>
97+
&nbsp;along with&nbsp;
98+
<a
99+
href="https://github.com/atyantik/pawjs"
100+
target="_blank"
101+
rel="noopener nofollow noreferrer"
102+
className={styles.link}
103+
>
104+
PawJS
105+
</a>
106+
</div>
107+
<div className={styles.p1}>
108+
If you wish to contribute more to the project please visit us at&nbsp;
109+
<a
110+
href="https://www.opencollective.com/react-pwa"
111+
target="_blank"
112+
rel="noopener nofollow noreferrer"
113+
className={styles.link}
114+
>
115+
https://www.opencollective.com/react-pwa
116+
</a>
117+
</div>
118+
<div className={styles.p1}>
119+
<a
120+
href="https://opencollective.com/react-pwa/donate"
121+
target="_blank"
122+
rel="nofollow noopener noreferrer"
123+
>
124+
<img alt="open-collective" src="https://opencollective.com/react-pwa/contribute/button@2x.png?color=blue" width="250" />
125+
</a>
126+
</div>
127+
</div>
128+
</div>
129+
<div className={styles.col4}>
130+
<div className={styles.p2}>
131+
<script src="https://codefund.io/scripts/fefc6de5-a0ce-46e8-a15d-f43733b5b454/embed.js" />
132+
<div id="codefund_ad" />
133+
</div>
134+
</div>
135+
</div>
136+
</div>
83137
</div>
84138
);
85139
}

src/client.js

+24
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,18 @@ const AppInitialState = {
77
count: 5,
88
},
99
};
10+
1011
export default class Client {
12+
trackPageView() {
13+
const { ga } = window;
14+
if (typeof ga !== 'undefined' && ga) {
15+
ga('send', {
16+
hitType: 'pageview',
17+
page: window.location.pathname,
18+
});
19+
}
20+
}
21+
1122
constructor({ addPlugin }) {
1223
const reduxClient = new ReduxClient({ addPlugin });
1324
reduxClient.setReducers(AppReducers);
@@ -23,5 +34,18 @@ export default class Client {
2334
const initialState = Object.assign({}, getInitialState(), AppInitialState);
2435
setInitialState(initialState);
2536
});
37+
38+
clientHandler.hooks.renderComplete.tap('InitTracking', () => {
39+
window.ga = window.ga || function () {
40+
(window.ga.q = window.ga.q || []).push(arguments);
41+
};
42+
window.ga.l = +new Date();
43+
window.ga('create', 'UA-108804791-1', 'auto');
44+
window.ga('send', 'pageview', window.location.pathname);
45+
});
46+
47+
clientHandler.hooks.locationChange.tapPromise('ReInitAds', async () => {
48+
this.trackPageView();
49+
});
2650
}
2751
}
66.6 KB
Loading

src/resources/img/favicon.ico

1.12 KB
Binary file not shown.

src/routes.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import ShareImg152 from './resources/img/icon-152x152.png';
66
import ShareImg192 from './resources/img/icon-192x192.png';
77
import ShareImg384 from './resources/img/icon-384x384.png';
88
import ShareImg512 from './resources/img/icon-512x512.png';
9+
import SocialShareImg from './resources/img/Social-Share-Image.png';
910

1011
export default class Routes {
1112
apply(routeHandler) {
@@ -73,7 +74,7 @@ export default class Routes {
7374
type: 'website',
7475
url: 'https://www.reactpwa.com/examples/redux',
7576
site_name: 'ReactPWA',
76-
image: ShareImg512,
77+
image: SocialShareImg,
7778
meta: [
7879
{
7980
name: 'author',

src/server.js

+10
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
import ReduxServer from '@pawjs/redux/server';
22
import * as AppReducers from './app/reducers';
3+
import React from 'react';
4+
import FavIcon from './resources/img/favicon.ico';
35

46
const AppInitialState = {
57
counter: {
@@ -23,5 +25,13 @@ export default class Server {
2325
const initialState = Object.assign({}, getInitialState(), AppInitialState);
2426
setInitialState(initialState);
2527
});
28+
29+
serverHandler.hooks.beforeHtmlRender.tap('AddGoogleAnalytics', (Application) => {
30+
Application.htmlProps.head.push(
31+
<link key="favicon" rel="shortcut icon" type="image/x-icon" href={FavIcon} />,
32+
<script key="addGoogleAnalytics" async src="https://www.google-analytics.com/analytics.js" />,
33+
);
34+
return Application;
35+
});
2636
}
2737
}

0 commit comments

Comments
 (0)