Country+

This project is a country listing and searching website that allows users to view key information about various countries. Users can search for countries and see details such as population, area, region, and language 🌍.

The project was developed using the Nuxt.js framework, and the data was provided by the REST Countries API.

Preview website: https://country-plus.vercel.app

📖 Features

• Search for countries 🌎
• View detailed information about countries in a table 📊
• View countries by language spoken 🗣
• View countries by region 🌍
• View countries of a region with comparative graph 📊
• Search countrues by name
• Dummy form with various fields with validation on submit 📖

⚙️ Project Setup

Before running the project, it is necessary to have npm and node installed on your machine.

Note

ℹ️ System Information:

• npm ~> v9.8.1
• node ~> v18.18.2

After checking or installing node and npm on your machine it is necessary to clone the git repository of the frontend with the following command:

$ git clone https://github.com/LuigiVanin/customer-manager-sample.git

Make sure to install the dependencies:

# npm
npm install

# pnpm
pnpm install

Development Server 🚀

Start the development server on http://localhost:3000:

# npm
npm run dev

# pnpm
pnpm dev

Production 🚀

Build the application for production:

# npm
npm run build

# pnpm
pnpm build

Locally preview production build:

# npm
npm run preview

# pnpm
pnpm preview

Check out the deployment documentation for more information.

Run Test 🧪

Warning

The cypress tests were all mode using chrome base browser as target.

Running tests in development mode and open cypress GUI

#npm
npm run cy:dev

# pnpm
pnpm cy:dev

to run in production mode and only using the terminal use the following command:

pnpm cy:ci:run

To run tests using docker use the following command with docker cli:

docker build -t cypress_tests . && docker run cypress_tests

Tools 🛠️

Other dependencies 📦

• Nuxt UI
• Chart.js
• Maska
• Tailwind Merge
• Zod

Contact 📞