psykat1116 / modern_periodic_table

A Beautiful, Responsive Periodic Table Web Application made using Next JS 13, Tailwind CSS, Framer Motion, Lottie Flies, Typescript

Modern Periodic Table

Welcome to the Modern Periodic Table Web Application, an innovative and immersive platform designed to provide an extensive exploration of the periodic table of elements, with a specific emphasis on all types of metals spanning every block. This website is for educational experience for individuals passionate about the diverse world of metals.

Table of Contents

1. Introduction 📌
2. Technology Used 🚀
3. Overview ⭐
4. Contribution Guidelines 📑
5. Contributing is fun 🧡

Introduction 📌

"Modern Periodic Table of Elements" serves as a dynamic bridge between aesthetics and knowledge, offering a comprehensive journey into the fascinating realm of metals. It caters to chemistry enthusiasts, students, and researchers, providing more than just a static presentation of elements. This application is a living, breathing resource designed to make the study of metals engaging and accessible.

Technology Used 🚀

1. Next Js
2. Tailwid CSS
3. Framer Motion
4. Typescript
5. React Icons

Overview ⭐

Explore the richness of metals in the periodic with detailed information and interactive features.

Features:

• Comprehensive Metal Insight:

  Dive into the details of various metal types, from alkali metals to transition metals and rare earth metals.

• Interactive Interface

  Navigate the periodic table effortlessly through an interactive interface.Click on specific elements to reveal comprehensive information, creating an enjoyable learning experience.

• Responsive Design:

  Whether you're on a desktop, tablet, or mobile device, ElementsX adapts seamlessly, ensuring an optimal viewing experience across various screen sizes.

• User-Friendly Presentation:

  It is designed for clarity and ease of use, making it accessible to users of all levels of expertise.

Contribution Guidelines 📑

• Firstly add a star(⭐) in this Repository.
• Fork the Repository and create a new branch for any updates/changes/issue you are working on.
• Start Coding and do changes.
• Commit your changes
• Create a Pull Request which will be reviewed and suggestions would be added to improve it.
• Add Screenshots and updated website links to help us understand what changes is all about.

Getting Started

git clone https://github.com/psykat1116/Modern_Periodic_Table.git

Important Point

You must change the file name Modern_Periodic_Table to the lowercase letter of your choice before entering into the folder otherwise it will show an error. It will also show errors and problems after running the project.

cd <your given file name>

Run the project

npm install
npm run dev

You Can See The Running Project in http://localhost:3000

Contributing is fun🧡

Contributions of any kind from anyone are always welcome!