country-glossary Tailwind Templates

Country Glossary

A dictionary of countries and its stats, built using Next, tailwind and Restcountries api.

Country Glossary App

Introduction

Ever wanted to have a quick access to all countries in the world? No worries, Country Glossary website is there to help you. This website is a Frontend Mentor Challenge. Users can simply surf through the website and select a country of their choice from region filter or search bar. This challenge is basically a test for theme change and api integrations.

Screenshots

(./design/desktop-design-home-dark.jpg) (./design/desktop-design-detail-dark.jpg)

Information displayed

Users can have a quick glance of country's flag, population, region, capital on the homepage. On selection of a particular country card, users will be able to have a detailed view of the country's native name, population, region, sub region, capital, border countries, TLD, area in sqr feets, currencies and languages spoken. They can also view the location of the country on google maps link provided.

API information

This project is built using Rest Countries api. Visit the website for more information on the REST Api Endpoints.

Tools/Frameworks used for the project

1) Next.js for frontend
2) Tailwind css for styling
3) Built using Typescript

Deployments

Live at Site Link

Github Repo at Github link

Future enhancements

1) Git Actions testing
2) Responsive design
3) Use of better data fetching techinques of Next.js

Top categories

Loading Svelte Themes