ATLASSION

Introduction

Welcome to Atlassion! This project is a website built using ReactJS and Typescript, aimed at providing comprehensive information about various software products developed by the company. Our team has meticulously crafted this website to offer users a seamless browsing experience while exploring information about the functionalities and features of popular Atlassion tools like Jira, Confluence, Bitbucket, and Atlas.

Project Type

Frontend

Deployed App

Frontend: https://atlasian-clone.netlify.app/
Backend: https://atlasion.onrender.com/

Directory Structure

Atlassion/ 
├─ backend/
    ├─ db.json
    ├─ server.js
    ├─ package.json
    ├─ package-lock.json
├─ atlassion_app/
    ├─ public/
    ├─ src/
‎      ├─ AuthContext
‎      ├─ Dashboard
      ├─ HomePage
      ├─ Dashboard
      ├─ Jira
      ├─ BitBucket
      ├─ Confluence
      ├─ Atlas
      ├─ JiraServiceManagement
      ├─ Utils
      ├─ Routes
    ├─ index.html
    ├─ package.json
    ├─ package-lock.json

Video Walkthrough of the project

Features

Key Features of the Application

• Detailed Information: Get in-depth insights into the capabilities and uses of Atlassian's software products.
• User Authentication: We've implemented user authentication using JSON-server-auth, allowing users to securely log in and access restricted content.
• Admin Dashboard: Utilizing JSON-server-auth, we've incorporated an admin dashboard feature that enables authorized users to manage site content effortlessly.

Installation & Getting started

Detailed instructions on how to install, configure, and get the project running:
Step 1: Clone the repository on terminal
Step 2: Move to the atlasion-app folder
Step 3: Install dependencies with the command npm install
Step 4: After the node modules have been installed, to start the app, run the command npm run dev

git clone https://github.com/tashwini-p/atlasion.git
cd atlasion-app
npm install 
npm run dev

Usage

Home Page

• Visit the Atlassion Website.
• Explore the homepage to understand more about the website.
• Navigate to specific sections or product pages through the functional navbar.
• Login/Register using the button in the navbar.
• Explore the middle tab section that changes the list of products and images based on the tab you click!

Product Pages

• Jira Service Management

• Confluence

• Atlas

  

• BitBucket

  

Admin Dashboard

Credentials

In order to be able to access the Admin Dashboard, enter these credentials in the Login Page :

Email : [email protected]
Password : Admin@123

APIs Used

JSON Mock Server - https://atlasion.onrender.com/

API Endpoints

In case of Backend Applications provide a list of your API endpoints, methods, brief descriptions, and examples of request/response. GET /users - list of all users POST /register - register new user POST /login - authentication of existing user

Technology Stack

• HTML
• CSS
• ReactJS
• Typescript