Skip to content

Commit 227b7fb

Browse files
Merge pull request #48 from hurricanemark/Phase2-BaselineToSeriousWorks
Phase2 baseline to serious works
2 parents a4c98c2 + 3de9b08 commit 227b7fb

File tree

4 files changed

+412
-1
lines changed

4 files changed

+412
-1
lines changed

README.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@ This project is intended for the beginner to novice javascript developers who ar
44

55
<br />
66

7+
![wireframe](./public/WeatherApp.drawio.png)
8+
79
# Weather Service
810

911
Ever wonder why your phone shows weather data of your immediate vicinity on your travel? This project demonstrates the use of Navigator.geolocation API that is part of NodeJS to pinpoint your immediate location. The geolocation method gets the current position in longitude and latitude. The weather app uses these values to call a weather service API for weather data. This non-interactive process happens automatically for your convenience.
@@ -245,7 +247,7 @@ The advantage of designing and implementing a responsive web app earlier is now
245247
246248
Before you invest time and effort developing mobile-native, convert this hosting URL using online converter such as [GoNative](https://gonative.io/app/0n4pabzw75m638htrqkvkmw5hw).
247249
248-
We also select [AppsGeyzer](https://appsgeyzer.com) to make another conversion for good measure. Download mobile image [here](https://appsgeyser.io/16161262/TechRolEmiWeather).
250+
We also select [AppsGeyzer](https://appsgeyser.com/blog/convert-website-to-mobile-app-free-software/) to make another conversion for good measure. Download mobile image [here](https://appsgeyser.io/16161262/TechRolEmiWeather).
249251
250252
Often, this is enough to demonstrate proof of concept. You can use it to make further decision in your mobile development.
251253

WeatherApp.drawio

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
<mxfile host="app.diagrams.net" modified="2022-10-27T18:41:24.103Z" agent="5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/106.0.0.0 Safari/537.36" etag="tYwVJsSSLtWsAguf6EVZ" version="20.5.1" type="github">
2+
<diagram id="WiCHa1WhsjDegjLb84WS" name="Page-1">
3+
<mxGraphModel dx="1297" dy="694" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="850" pageHeight="1100" math="0" shadow="0">
4+
<root>
5+
<mxCell id="0" />
6+
<mxCell id="1" parent="0" />
7+
<mxCell id="OPkBnLGld1baVavcbmju-10" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;fontSize=12;entryX=0;entryY=0.5;entryDx=0;entryDy=0;" edge="1" parent="1" source="OPkBnLGld1baVavcbmju-1" target="OPkBnLGld1baVavcbmju-4">
8+
<mxGeometry relative="1" as="geometry">
9+
<mxPoint x="35" y="300" as="targetPoint" />
10+
</mxGeometry>
11+
</mxCell>
12+
<object label="User" id="OPkBnLGld1baVavcbmju-1">
13+
<mxCell style="shape=umlActor;verticalLabelPosition=bottom;verticalAlign=top;html=1;outlineConnect=0;" vertex="1" parent="1">
14+
<mxGeometry x="20" y="160" width="30" height="60" as="geometry" />
15+
</mxCell>
16+
</object>
17+
<mxCell id="OPkBnLGld1baVavcbmju-12" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;fontSize=12;" edge="1" parent="1" source="OPkBnLGld1baVavcbmju-4" target="OPkBnLGld1baVavcbmju-11">
18+
<mxGeometry relative="1" as="geometry" />
19+
</mxCell>
20+
<mxCell id="OPkBnLGld1baVavcbmju-4" value="User App&lt;br&gt;&lt;br&gt;&lt;div style=&quot;text-align: left;&quot;&gt;&lt;ul&gt;&lt;li&gt;GET &#39;/&#39;&lt;/li&gt;&lt;li&gt;POST &#39;/&#39;&lt;/li&gt;&lt;li&gt;GET &#39;/weatherbit&#39;&lt;/li&gt;&lt;li&gt;POST &#39;/weatherbit&#39;&lt;/li&gt;&lt;li&gt;GET &#39;\about&#39;&lt;/li&gt;&lt;/ul&gt;&lt;/div&gt;" style="whiteSpace=wrap;html=1;verticalAlign=top;" vertex="1" parent="1">
21+
<mxGeometry x="110" y="135" width="200" height="125" as="geometry" />
22+
</mxCell>
23+
<mxCell id="OPkBnLGld1baVavcbmju-6" value="&lt;h1&gt;TechRolEmi Weather Cast&lt;/h1&gt;&lt;p&gt;&lt;font style=&quot;font-size: 12px;&quot; face=&quot;-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji&quot;&gt;An Embedded JavaScript&amp;nbsp;(EJS) responsive web app using NodeJS-Express scaffolding to call weather API providers for weather reports.&lt;/font&gt;&lt;/p&gt;&lt;p&gt;.&lt;/p&gt;" style="text;html=1;strokeColor=none;fillColor=none;spacing=5;spacingTop=-20;whiteSpace=wrap;overflow=hidden;rounded=0;" vertex="1" parent="1">
24+
<mxGeometry x="10" y="10" width="720" height="110" as="geometry" />
25+
</mxCell>
26+
<mxCell id="OPkBnLGld1baVavcbmju-14" value="Yes" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;fontSize=12;" edge="1" parent="1" source="OPkBnLGld1baVavcbmju-11" target="OPkBnLGld1baVavcbmju-18">
27+
<mxGeometry relative="1" as="geometry">
28+
<mxPoint x="565" y="197.5" as="targetPoint" />
29+
</mxGeometry>
30+
</mxCell>
31+
<mxCell id="OPkBnLGld1baVavcbmju-16" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;fontSize=12;entryX=0.5;entryY=0;entryDx=0;entryDy=0;" edge="1" parent="1" source="OPkBnLGld1baVavcbmju-11" target="OPkBnLGld1baVavcbmju-19">
32+
<mxGeometry relative="1" as="geometry">
33+
<mxPoint x="415" y="320" as="targetPoint" />
34+
</mxGeometry>
35+
</mxCell>
36+
<mxCell id="OPkBnLGld1baVavcbmju-17" value="No" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];fontSize=12;" vertex="1" connectable="0" parent="OPkBnLGld1baVavcbmju-16">
37+
<mxGeometry x="-0.2994" relative="1" as="geometry">
38+
<mxPoint as="offset" />
39+
</mxGeometry>
40+
</mxCell>
41+
<mxCell id="OPkBnLGld1baVavcbmju-11" value="&lt;br&gt;&lt;br&gt;Geolocator Allowed?" style="rhombus;whiteSpace=wrap;html=1;verticalAlign=top;" vertex="1" parent="1">
42+
<mxGeometry x="360" y="147.5" width="110" height="100" as="geometry" />
43+
</mxCell>
44+
<mxCell id="OPkBnLGld1baVavcbmju-24" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;fontSize=12;fontColor=#000000;entryX=0.5;entryY=0;entryDx=0;entryDy=0;" edge="1" parent="1" source="OPkBnLGld1baVavcbmju-18" target="OPkBnLGld1baVavcbmju-21">
45+
<mxGeometry relative="1" as="geometry">
46+
<mxPoint x="645" y="350" as="targetPoint" />
47+
</mxGeometry>
48+
</mxCell>
49+
<mxCell id="OPkBnLGld1baVavcbmju-25" value="JSON" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];fontSize=12;fontColor=#000000;" vertex="1" connectable="0" parent="OPkBnLGld1baVavcbmju-24">
50+
<mxGeometry x="-0.5569" relative="1" as="geometry">
51+
<mxPoint as="offset" />
52+
</mxGeometry>
53+
</mxCell>
54+
<mxCell id="OPkBnLGld1baVavcbmju-18" value="&lt;div style=&quot;text-align: left;&quot;&gt;&lt;span style=&quot;background-color: initial; box-sizing: border-box; font-family: ui-monospace, SFMono-Regular, &amp;quot;SF Mono&amp;quot;, Menlo, Consolas, &amp;quot;Liberation Mono&amp;quot;, monospace;&quot; class=&quot;pl-c1&quot;&gt;1. Geolocation&lt;/span&gt;&lt;span style=&quot;background-color: initial; box-sizing: border-box; font-family: ui-monospace, SFMono-Regular, &amp;quot;SF Mono&amp;quot;, Menlo, Consolas, &amp;quot;Liberation Mono&amp;quot;, monospace;&quot; class=&quot;pl-kos&quot;&gt;.&lt;/span&gt;&lt;span style=&quot;background-color: initial; box-sizing: border-box; font-family: ui-monospace, SFMono-Regular, &amp;quot;SF Mono&amp;quot;, Menlo, Consolas, &amp;quot;Liberation Mono&amp;quot;, monospace;&quot; class=&quot;pl-en&quot;&gt;getCurrentPosition&lt;/span&gt;&lt;/div&gt;&lt;span class=&quot;pl-en&quot; style=&quot;box-sizing: border-box; font-family: ui-monospace, SFMono-Regular, &amp;quot;SF Mono&amp;quot;, Menlo, Consolas, &amp;quot;Liberation Mono&amp;quot;, monospace;&quot;&gt;&lt;div style=&quot;text-align: left;&quot;&gt;&lt;span style=&quot;background-color: initial; box-sizing: border-box;&quot; class=&quot;pl-en&quot;&gt;2.&amp;nbsp;&lt;/span&gt;&lt;span style=&quot;background-color: initial;&quot;&gt;getLocalWeather(longitude, latitude, secret, 0);&lt;/span&gt;&lt;/div&gt;&lt;/span&gt;&lt;span style=&quot;box-sizing: border-box; font-family: ui-monospace, SFMono-Regular, &amp;quot;SF Mono&amp;quot;, Menlo, Consolas, &amp;quot;Liberation Mono&amp;quot;, monospace; text-align: start;&quot; class=&quot;pl-en&quot;&gt;&lt;br&gt;&lt;/span&gt;" style="rounded=1;whiteSpace=wrap;html=1;fontSize=12;" vertex="1" parent="1">
55+
<mxGeometry x="520" y="150" width="250" height="100" as="geometry" />
56+
</mxCell>
57+
<mxCell id="OPkBnLGld1baVavcbmju-22" value="" style="edgeStyle=orthogonalEdgeStyle;rounded=0;orthogonalLoop=1;jettySize=auto;html=1;fontSize=12;fontColor=#000000;" edge="1" parent="1" source="OPkBnLGld1baVavcbmju-19" target="OPkBnLGld1baVavcbmju-21">
58+
<mxGeometry relative="1" as="geometry" />
59+
</mxCell>
60+
<mxCell id="OPkBnLGld1baVavcbmju-26" value="JSON" style="edgeLabel;html=1;align=center;verticalAlign=middle;resizable=0;points=[];fontSize=12;fontColor=#000000;" vertex="1" connectable="0" parent="OPkBnLGld1baVavcbmju-22">
61+
<mxGeometry x="-0.2218" relative="1" as="geometry">
62+
<mxPoint as="offset" />
63+
</mxGeometry>
64+
</mxCell>
65+
<mxCell id="OPkBnLGld1baVavcbmju-19" value="&lt;div style=&quot;text-align: left;&quot;&gt;&lt;span style=&quot;background-color: initial;&quot;&gt;1.&amp;nbsp; ReadInput(cityName)&lt;/span&gt;&lt;/div&gt;&lt;div style=&quot;text-align: left;&quot;&gt;&lt;span style=&quot;background-color: initial;&quot;&gt;2.&amp;nbsp; getLocalWeather(cityName, secret, 0);&lt;/span&gt;&lt;/div&gt;" style="rounded=1;whiteSpace=wrap;html=1;fontSize=12;" vertex="1" parent="1">
66+
<mxGeometry x="180" y="320" width="295" height="60" as="geometry" />
67+
</mxCell>
68+
<mxCell id="OPkBnLGld1baVavcbmju-21" value="&lt;span class=&quot;pl-s1&quot; style=&quot;box-sizing: border-box; font-family: ui-monospace, SFMono-Regular, &amp;quot;SF Mono&amp;quot;, Menlo, Consolas, &amp;quot;Liberation Mono&amp;quot;, monospace; text-align: start;&quot;&gt;result&lt;/span&gt;&lt;span class=&quot;pl-kos&quot; style=&quot;box-sizing: border-box; font-family: ui-monospace, SFMono-Regular, &amp;quot;SF Mono&amp;quot;, Menlo, Consolas, &amp;quot;Liberation Mono&amp;quot;, monospace; text-align: start;&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;pl-c1&quot; style=&quot;box-sizing: border-box; font-family: ui-monospace, SFMono-Regular, &amp;quot;SF Mono&amp;quot;, Menlo, Consolas, &amp;quot;Liberation Mono&amp;quot;, monospace; text-align: start;&quot;&gt;innerHTML&lt;/span&gt;&lt;span style=&quot;font-family: ui-monospace, SFMono-Regular, &amp;quot;SF Mono&amp;quot;, Menlo, Consolas, &amp;quot;Liberation Mono&amp;quot;, monospace; text-align: start;&quot;&gt; &lt;/span&gt;&lt;span class=&quot;pl-c1&quot; style=&quot;box-sizing: border-box; font-family: ui-monospace, SFMono-Regular, &amp;quot;SF Mono&amp;quot;, Menlo, Consolas, &amp;quot;Liberation Mono&amp;quot;, monospace; text-align: start;&quot;&gt;= JSON.parse(xhttp.responseText);&lt;/span&gt;" style="shape=hexagon;perimeter=hexagonPerimeter2;whiteSpace=wrap;html=1;fixedSize=1;rounded=1;" vertex="1" parent="1">
69+
<mxGeometry x="267.5" y="450" width="502.5" height="80" as="geometry" />
70+
</mxCell>
71+
</root>
72+
</mxGraphModel>
73+
</diagram>
74+
</mxfile>

0 commit comments

Comments
 (0)