Giter Club home page Giter Club logo

f-a-b-r-i-z-i-o / weatherapp Goto Github PK

View Code? Open in Web Editor NEW
3.0 1.0 1.0 138.78 MB

In this project a weather app with different sections is developed. the first represents the home with the various cities of which it is possible to see the forecasts. The second in that a map is displayed the third instead allows you to view some users who use the app.

License: MIT License

JavaScript 86.36% TypeScript 0.23% Java 8.00% HTML 0.06% Batchfile 0.09% Objective-C 5.06% C# 0.11% SCSS 0.10%
ionic angular cordova metaweather-api mapbox-api

weatherapp's Introduction

WeatherApp ๐ŸŒจ๏ธ

The source code is visible in the second branch


This project is developed using angular 12 and ionic 5.9.2.

To develop the project it is necessary to install nodejs, the installation of node is different in each operating system (see installation documentation). After doing this you need to install angular.

npm install -g @angular/cli

after installing angular it is necessary to install ionic.

npm install -g @ionic/cli

After installing ionic I generated the project only with Cordova as Capacitor gives me some problems.

ionic start tempo tabs --type=angular --cordova

Within the tabs I have generated folders as you can see from the project.

ionic g page /folder/nameFolder

In this project a weather app with different sections is developed.

The first ๐Ÿ™๏ธ

Represents the home with the various cities of which it is possible to see the forecasts. After clicking on one of the visible cities, you can see the relative weather.

home

tempo

The second :parking:

In that a map is displayed. In the map you can see my position with the relative marker in addition it is possible to return to the time page by clicking on one of the relative markers positioned on the map to see the weather of the selected city. Before accessing the map, authorization must be requested to access one's position and enable the GPS. After doing this the map will load correctly.

pos

mapMY

The third ๐Ÿ˜Ž

In the third tab you can first see the users who have downloaded the app, after clicking them you can see their information in detail.

user

user-detail

user-detail2

If the loading of any page is slow or some query fails, error / laoding screens will be displayed.

Screenshot 2021-12-13 101033

To run project on web types:

npm start

If you want to "run" the project natively (using a physical device) First you need to add the platforms (android / ios)

ionc cordova platform add (android/ios)

Only after

ionc cordova run android

To run the app in debug mode with the web

npm run run:live android

Else if you want run the app with node

npm run run:run android

Enjoy 2F

weatherapp's People

Contributors

f-a-b-r-i-z-i-o avatar

Stargazers

 avatar  avatar  avatar

Watchers

 avatar

Forkers

trellixvulnteam

weatherapp's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.