Skip to content

Commit c00eb4f

Browse files
committed
modified: public/README.md
1 parent 30bd4a3 commit c00eb4f

File tree

1 file changed

+20
-13
lines changed

1 file changed

+20
-13
lines changed

public/README.md

Lines changed: 20 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
# Core Logic
44

5-
To obtain the pinpoint weather data, earth location is a required parameter. For this, the longitude and latitude would suffice programmatically. For the interactive option, a physical postal address (partial address of City, State, or Country) is required. Optionally, you could also register with the google map service (*additional charge will incur*). Then, integrate google-map API where the user can point to a location on the map to trigger a localized weather report.
5+
To obtain the pinpoint weather data non-interactively, earth location(GPS) is a required parameter. For this, the longitude and latitude would suffice programmatically. For the interactive option, input of a physical postal address (partial address of City, State, or Country) is required. Optionally, you could also register with the google map service (*additional charge will incur*). Then, a touch or click event on the google map will yield the latitide and longitude among other values.
66

77
* The geolocation of a known address can be obtained by using the client-side javascript [Windows Navigator](https://www.w3schools.com/jsref/obj_navigator.asp). Your browser uses different types and sources of information to identify your location. These include your IP address, geolocation via HTML5 in your browser, and your PC's language and time settings. For more detail on how Navigator.geolocation is determined, [read more here](https://developer.mozilla.org/en-US/docs/Web/API/Geolocation/getCurrentPosition).
88

@@ -27,25 +27,30 @@ Sample code for client-side geolocation:
2727
</script>
2828
```
2929
30-
* The API query for weather data can be describe as follow.
31-
32-
> `https://api.weatherbit.io/v2.0/history/airquality?city=${LOCATION}&start_date=2022-10-03&end_date=2022-10-04&tz=local&key=${API_ACCESS_KEY}`
3330
34-
Where, **LOCATION** can be City, State
31+
<br />
3532
36-
and **API_ACCESS_KEY** can be obtained from registering with an API provider.
33+
## Getting Real Data from A Paid API Provider
3734
38-
* With the return JSON object representing the weather data, you wrap the individual data objects in a grid to make it user-friendly.
35+
In this project (file: public/scripts.js), you can use the API service from the [weatherbit.io](https://api.weatherbit.io/v2.0/). The good news is no credit card is required (at the time I develop this app). You registered to use the free tier, and there is no charge as long as you stay within the allowed call limit of 1500 calls/day. You will get errorCode 429 when you'd reached the daily limit, in which case, wait until the next daily cycle begins. Read [here](https://www.weatherbit.io/faq) to learn ways to make weather API calls.
3936
40-
<br />
37+
* A typical API query for weather data can be described as follow.
38+
39+
> `https://api.weatherbit.io/v2.0/history/airquality?city=${LOCATION}&start_date=${START_DATE}&end_date=${END_DATE}&tz=local&key=${API_ACCESS_KEY}`
4140
42-
# Getting Real Data from A Paid API Provider
41+
Where,
42+
43+
**LOCATION** can be City, State.
44+
45+
**START_DATE, END_DATE** in 'YYYY-MM-DD' format and evaluate to datetime range.
4346
44-
Replace freecodecamp proxy URI (file: public/scripts.js) for weather data provider via a paid subscription. In this project, you can use the API service from the [weatherbit.io](https://api.weatherbit.io/v2.0/). The good news is no credit card is required (at the time I develop this app). You registered to use the free tier, and there is no charge as long as you stay within the allowed call limit of 1500 calls/day. You will get errorCode 429 when you'd reached the limit. Read [here](https://www.weatherbit.io/faq) to learn ways to make weather API calls.
47+
**API_ACCESS_KEY** can be obtained from registering with an API provider.
48+
49+
* Parse the return JSON object from the API call into a GUI grid for presentation.
4550
4651
<br />
4752
48-
# Steps to Integrate A New API Provider
53+
## Steps to Integrate A New API Provider
4954
5055
1. Register with a weather reporting service. Consult with their API documentation on how to call their APIs.
5156
2. Obtain the API access key from the same provider above.
@@ -70,20 +75,22 @@ You would want to live free and die harder, let's make the client calls the serv
7075
**Options**:
7176
7277
You will need to implement a middleware to retrieve weather data and serve it to the client using either
73-
- `EJS` embedded templates
78+
- `EJS` embedded javascript templates
7479
- or `ReactJS`.
7580
7681
Obviously, many developers have accountered this issue. Lucky for us, `EJS`, `ReactJS` typically solves this problem. EJS is an easier choice having less of a learning curve.
7782
7883
**Decision:**
79-
Let's introduce the Embedded Javascript ([EJS](https://www.npmjs.com/package/ejs)) middleware template rendering weather data upon client requestt.
84+
Let's introduce the Embedded Javascript ([EJS](https://www.npmjs.com/package/ejs)) middleware template rendering weather data upon client requests.
8085
8186
## Steps to Implement EJS In the Project
8287
8388
<strong>Partial files to be injected to other ejs files.</strong>
8489
8590
1. Create sub-directory `partials` under `views`.
8691
92+
Partial files are pieces of reusable code segment that typically appear again and again throughout your project.
93+
8794
The project tree structure will look as follow:
8895
```c
8996
+ public

0 commit comments

Comments
 (0)