Skip to content

You found something great! This is my portfolio made with React, it contains information about Me, Experience, Skills, Projects, Contact and terrible jokes

License

Notifications You must be signed in to change notification settings

MakeRedundant/Brian_Trang_React

Repository files navigation

Brian Trang || Portoflio

You stumbled onto my personal portoflio, have a look around!!
https://brian-trang-portfolio.netlify.app/

Github licence JavaScript Badge @fortawesome/free-brands-svg-icons @fortawesome/react-fontawesome devicon emailjs emailjs-com react react-router-dom react-router-hash-link animate.css react-on-screen bootstrap install react-dom react-icons react-simple-typewriter semantic-ui-css semantic-ui-react sweetalert2 @vitejs/plugin-react eslint eslint-plugin-react eslint-plugin-react-hooks eslint-plugin-react-refresh vite Netlify Status

📓 Table of Contents

💡🏡 Lighthouse

This is the Lighthouse Google report showcasing Performance 🚀, Accessibility ♿️, Best practices ✅, and SEO 🔍.

Lighthouse

📄 Description

Contains About Me, Experience, Skills, Projects, Contact, Resume, Email, Footer
also contains bad humour!

🪛 Technologies used

Technology Description Link
Node.js Server-side JavaScript runtime Node.js
NPM Node.js Package Manager NPM
Font Awesome Icon set and toolkit Font Awesome
Font Awesome (React) Font Awesome for React components Font Awesome (React)
EmailJS Email delivery service EmailJS
EmailJS (Com) Email service for developers EmailJS (Com)
React JavaScript library for building UIs React
React DOM React rendering for the DOM
react-router-dom Declarative routing for React.js react-router-dom
react-router-hash-link Hash link navigation for React Router react-router-hash-link
animate.css Library for animations animate.css
react-on-screen React component for on-screen events react-on-screen
bootstrap Front-end framework bootstrap
install Package manager for JavaScript install
React Icons SVG icon library for React React Icons
React Simple Typewriter React component for typewriter effect React Simple Typewriter
Semantic UI CSS Front-end framework Semantic UI CSS
Semantic UI React React integration for Semantic UI Semantic UI React
SweetAlert2 Alert library for JavaScript SweetAlert2
Vite (Plugin React) Vite plugin for React apps Vite (Plugin React)
ESLint JavaScript linter ESLint
ESLint (Plugin React) ESLint plugin for React ESLint (Plugin React)
ESLint (Plugin React Hooks) ESLint plugin for React Hooks ESLint (Plugin React Hooks)
ESLint (Plugin React Refresh) ESLint plugin for React Refresh ESLint (Plugin React Refresh)
Vite Frontend build tool Vite
Netlify Web hosting and automation platform Netlify

🖥️Installation

Users can clone the code and run npm install to install the dependencies

 npm install 

Afterwards users can run the command npm run build which will run the Vite build process which will bundle the React source code

npm run build

Afterwards users can run the command npm run dev which will executes the vite command, which starts the development server provided by Vite
and allows users to run the code on their local host

npm run dev

This sequence ensures that your client-side code is built before starting the server.

Otherwise this app requires use of the Vite application to be used as well as the following installations.

Vite

`npm create vite@latest`

EmailJS

npm i emailjs

EmailJS-Com

npm i emailjs-com

React Icons

npm i react-icons

React Simple Typewriter

npm i react-simple-typewriter

Bootstrap

npm i bootstrap

React-boostrap

npm i react-bootstrap

Animate.css

npm i animate.css

React on screen

npm i react-on-screen

ESLint

npm i eslint

ESLint Plugin React

npm i eslint-plugin-react

Netlify CLI

npm i netlify-cli -g

React DOM

npm i react-dom

Package.json dependencies ⚙️

    "@fortawesome/free-brands-svg-icons": "^6.4.2",
    "@fortawesome/react-fontawesome": "^0.2.0",
    "devicon": "^2.15.1",
    "bootstrap": "^5.3.2",
    "emailjs": "^4.0.3",
    "emailjs-com": "^3.2.0",
    "install": "^0.13.0",
    "react": "^18.2.0",
    "react-bootstrap": "^2.9.2",
    "react-dom": "^18.2.0",
    "react-icons": "^4.11.0",
    "react-simple-typewriter": "^5.0.1",
    "react-router-dom": "^6.3.0",
    "react-router-hash-link": "^2.4.3",
    "semantic-ui-css": "^2.5.0",
    "semantic-ui-react": "^2.1.4",
    "sweetalert2": "^11.7.32",
    "animate.css": "^4.1.1",
    "react-on-screen": "^2.1.1"

💬Usage

Have a look around!! Link to deployed application https://brian-trang-portfolio.netlify.app

🖼️Screenshot

Screenshot of Header Header

Screenshot of About About

Screenshot of Main Project Main-project

Screenshot of Skills Skills

Screenshot of Projects Project

Screenshot of Email Uses EmailJS to send emails to Brian.trang9@gmail.com Email

📹Video

GIF Showing npm run dev as well as the Header , About , Skills, Experience, Projects, Nav bar functionality
as well as Email functionality GIF

⚖️License

This project is licensed under MIT

🤝Contributing

Brian Trang
With thanks to USYD

🛠️Tests

N/A

❔Questions

If you have any questions about this project, please contact me directly at brian.trang9@gmail.com. Feel free to view more of my projects at https://github.com/MakeRedundant.

About

You found something great! This is my portfolio made with React, it contains information about Me, Experience, Skills, Projects, Contact and terrible jokes

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published