A webapp, with a sci-fi/futuristic design, to monitor vital signs of our planet and educate and raise awareness among the users about global warming and climate change.
I have used different public APIs to access data. Most of them don't require key or authentication. This is the open-source API list:
Images are from Pixabay. All the informations on blog section are from NASA > Climate Change section, articles from Our World in Data, Effects of climate change on WWF website and Copernicus > Climate Change Service.
This is the base of the project:
- React
- Vite
- Tailwind CSS
Other libraries:
- Arwes: a sci-fi/futuristic UI libraries
- MUI: a wonderful library of React components
- Chart.js: for costumizable Javascript charts
- FontAwesome: a huge icons library
- Framer Motion: a simple motion library for React
- Axios: for fetching data from APIs
Warning
Arwes does not work with React Strict Mode nor React Server Components (RSC). So I've abilited React.StrictMode only during development:
if (process.env.NODE_ENV === 'development') {
ReactDOM.createRoot(document.getElementById('root')).render(
<React.StrictMode>
<App/>
</React.StrictMode>
)
} else {
ReactDOM.createRoot(document.getElementById('root')).render(
<App/>
)
}
Important
Arwes is under development and still in alpha release, so the components are being tested and their API may change as it gets completed.
One planet project - Powered by Vercel ▲