Skip to content

Commit bf3acf7

Browse files
princiyaprinciya
authored
Merge pull request #38 from akshitdandyan/EnablePwaSupport
Fixes #[31] Enable pwa support
2 parents e0419a7 + fb3f316 commit bf3acf7

11 files changed

+107
-12
lines changed

‎public/favicon.ico

-3.78 KB
Binary file not shown.

‎public/icons/apple-touch-icon.png

21.2 KB
Loading

‎public/icons/favicon.ico

15 KB
Binary file not shown.

‎public/icons/icon192.png

23.9 KB
Loading

‎public/icons/icon512.png

98 KB
Loading

‎public/index.html

+12-4
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,11 @@
33

44
<head>
55
<meta charset="utf-8" />
6-
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
6+
<link rel="icon" href="./icons/favicon.ico" />
77
<meta name="viewport" content="width=device-width, initial-scale=1" />
88
<meta name="theme-color" content="#000000" />
9-
<meta name="description" content="Web site created using create-react-app" />
10-
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
9+
<meta name="description" content="Women Who Code Front End Study Group Project" />
10+
<link rel="apple-touch-icon" href="%PUBLIC_URL%/icons/apple-touch-icon.png" />
1111
<!--
1212
manifest.json provides metadata used when your web app is installed on a
1313
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
@@ -25,7 +25,7 @@
2525
<link rel="preconnect" href="https://fonts.googleapis.com">
2626
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
2727
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap" rel="stylesheet">
28-
<title>React App</title>
28+
<title>Women Who Code</title>
2929
</head>
3030

3131
<body>
@@ -41,6 +41,14 @@
4141
To begin the development, run `npm start` or `yarn start`.
4242
To create a production bundle, use `npm run build` or `yarn build`.
4343
-->
44+
<script>
45+
if ('serviceWorker' in navigator) {
46+
window.addEventListener('load', async () => {
47+
const register = await navigator.serviceWorker.register('./serviceworker.js')
48+
.catch(error => console.log('Browser does not support service worker'))
49+
})
50+
}
51+
</script>
4452
</body>
4553

4654
</html>

‎public/logo192.png

-5.22 KB
Binary file not shown.

‎public/logo512.png

-9.44 KB
Binary file not shown.

‎public/manifest.json

+11-8
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,24 @@
11
{
2-
"short_name": "React App",
3-
"name": "Create React App Sample",
2+
"short_name": "Women Who Code",
3+
"name": "Frontend Study Group",
4+
"scope": "./",
45
"icons": [
56
{
6-
"src": "favicon.ico",
7-
"sizes": "64x64 32x32 24x24 16x16",
7+
"src": "icons/favicon.ico",
8+
"sizes": "48x48",
89
"type": "image/x-icon"
910
},
1011
{
11-
"src": "logo192.png",
12+
"src": "icons/icon192.png",
1213
"type": "image/png",
13-
"sizes": "192x192"
14+
"sizes": "192x192",
15+
"purpose": "maskable any"
1416
},
1517
{
16-
"src": "logo512.png",
18+
"src": "icons/icon512.png",
1719
"type": "image/png",
18-
"sizes": "512x512"
20+
"sizes": "512x512",
21+
"purpose": "maskable any"
1922
}
2023
],
2124
"start_url": ".",

‎public/offline.html

+43
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
8+
<title>FRONTEND STUDY GROUP</title>
9+
<style>
10+
.offline-div{
11+
display: flex;
12+
flex-direction: column;
13+
justify-content: center;
14+
align-items: center;
15+
height: 100vh;
16+
font-family: Arial, Helvetica, sans-serif;
17+
text-align: center;
18+
}
19+
.offline-div>div>h1{
20+
font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
21+
color: rgb(0, 122, 124);
22+
}
23+
.offline-div>div{
24+
width: 400px;
25+
max-width: 90vw;
26+
border-radius: 8px;
27+
box-shadow: 0px 4px 10px 1px rgba(42, 42, 42, 0.1), 0px -4px 10px 1px rgba(42, 42, 42, 0.1);
28+
padding: 12px 8px;
29+
}
30+
</style>
31+
</head>
32+
33+
<body>
34+
<div class="offline-div">
35+
<div>
36+
<h1>Frontend Study Group</h1>
37+
<p style="color: red;">You are currently offline.</p>
38+
<p>Fix your internet connection, and try reloading.</p>
39+
</div>
40+
</div>
41+
</body>
42+
43+
</html>

‎public/serviceworker.js

+41
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
const CACHE_NAME = 'FRONTENDSTUDYGRPU{';
2+
const urlsToCache = ['index.html', 'offline.html'];
3+
4+
const self = this;
5+
6+
// Installing Service Worker
7+
self.addEventListener('install',(e)=>{
8+
e.waitUntil(
9+
caches.open(CACHE_NAME)
10+
.then(cache=>{
11+
return cache.addAll(urlsToCache);
12+
})
13+
)
14+
})
15+
16+
// Listing Requests
17+
self.addEventListener('fetch',(e)=>{
18+
e.respondWith(
19+
caches.match(e.request)
20+
.then(()=>{
21+
return fetch(e.request)
22+
.catch(()=>caches.match('offline.html'))
23+
})
24+
)
25+
})
26+
27+
// Activate serviceworker
28+
self.addEventListener('activate',e=>{
29+
const cacheWhiteList = [];
30+
cacheWhiteList.push(CACHE_NAME);
31+
e.waitUntil(
32+
caches.keys()
33+
.then(cacheNames => Promise.all(
34+
cacheNames.map(cacheName=>{
35+
if(!cacheWhiteList.includes(cacheName)){
36+
return caches.delete(cacheName)
37+
}
38+
})
39+
))
40+
)
41+
})

0 commit comments

Comments
 (0)