https://github.com/riascho/typescriptaddresstomap

This project is a simple web application that allows users to enter an address, search for it using the Google Maps API, and display the location on a map with a marker.
https://github.com/riascho/typescriptaddresstomap

axios typescript webpack

Last synced: 6 days ago
JSON representation

This project is a simple web application that allows users to enter an address, search for it using the Google Maps API, and display the location on a map with a marker.

• Host: GitHub
• URL: https://github.com/riascho/typescriptaddresstomap
• Owner: riascho
• Created: 2024-10-23T18:17:37.000Z (2 months ago)
• Default Branch: main
• Last Pushed: 2024-10-23T18:19:13.000Z (2 months ago)
• Last Synced: 2024-10-31T23:07:43.158Z (about 2 months ago)
• Topics: axios, typescript, webpack
• Language: TypeScript
• Homepage:
• Size: 3.01 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# TypeScript Project - Address to Map

This project is a simple web application that allows users to enter an address, search for it using the Google Maps API, and display the location on a map with a marker. The application is built using `TypeScript` and bundled with `Webpack`.

Built for the [Understanding Typescript Course](https://www.udemy.com/course/understanding-typescript) on Udemy.

![Demo]()

## Getting Started

### Prerequisites

- Node.js and npm installed on your machine.

### Setup

1. **Clone the repository:**

   ```bash

   git clone https://github.com/riascho/TypeScriptAddressToMap.git

   cd TypeScriptAddressToMap

   ```

2. **Install dependencies:**

   ```bash

   npm install

   ```

3. **Enter your Google API Key:**

   - Obtain your API key from the [Google Maps API](https://developers.google.com/maps/documentation/geocoding/get-api-key).

   - Replace `YOUR_API_KEY` in the `src/app.ts` and `index.html` files with your actual API key.

4. **Start the development server:**

   ```bash

   npm start

   ```

## Packages and Libraries Used

- **TypeScript:** A strongly typed programming language that builds on JavaScript.

- **Webpack:** A module bundler to bundle JavaScript files for usage in a browser.

- **Axios:** A promise-based HTTP client for making requests to the Google Maps API.

- **@types/googlemaps:** TypeScript type definitions for the Google Maps JavaScript API, providing type safety and autocompletion features when working with the Google Maps API in TypeScript.