NAME: PAILA PAVANI
INTERN ID: CT08DM142
DOMAIN: FULL STACK WEB DEVELOPMENT
DURATION: 8 WEEKS
MENTOR: NEELA SANTHOSH KUMAR
This Weather App is a simple and user-friendly web application that helps people check the current weather and 5-day weather forecast for any city in the world. The app is designed using basic web development tools and works directly in your web browser—no need to install anything.
The Weather App allows users to:
- Enter the name of a city (e.g., "New York" or "Hyderabad").
- Click a button to get the current temperature, weather condition (sunny, rainy, cloudy), and 5-day forecast.
- View weather icons (like sun or cloud images) for easy understanding.
- See the city name clearly displayed above the forecast.
-
HTML (HyperText Markup Language):
Creates the input box, buttons, and sections where the weather data is shown. -
CSS (Cascading Style Sheets):
Styles the app—backgrounds, fonts, layout, colors, and responsiveness. -
JavaScript:
Adds interactivity:- Fetches weather data from a weather service.
- Displays current and forecasted weather.
- Handles invalid inputs or errors.
-
OpenWeatherMap API:
Supplies live weather data. An API (Application Programming Interface) allows our app to communicate with OpenWeatherMap.
- Built for the web, so it works on any browser-enabled device (PC, phone, tablet).
- Lightweight—no backend or database required.
- Can be hosted on GitHub Pages, Netlify, or Vercel for free.
- Current Weather: Displays city, temperature (°C), and condition.
- 5-Day Forecast: With icons, temperature, and short descriptions.
- Responsive Design: Fits all screen sizes.
- City Validation: Displays a friendly message if the input is wrong.
- Clean UI: White background, blue accents, soft shadows for modern look.
- How to use HTML, CSS, JavaScript to build real-world apps.
- How to fetch and use live data from public APIs.
- DOM manipulation using JavaScript for real-time updates.
- Code organization and structure for readability and maintenance.
This Weather App project is a great start for beginners to practice full-stack web development basics. It teaches you how to:
- Build a web interface from scratch.
- Use an external API.
- Make an interactive application without reloading pages.
- Display useful real-time information with clean design.
With enhancements like a map view or hourly forecast, this can grow into a complete weather dashboard.
