Skip to content

LukeHW/Updated-Website

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 

Repository files navigation

Welcome to my portfolio!

Made with React, Material UI, JS, HTML, and CSS; this website displays some of my projects, pictures, and other works that I have contributed to. Feel free to look around.

Created with

Material UI

MUI provides a robust, customizable, and accessible library of foundational and advanced components, enabling you to build your own design system and develop React applications faster.

React and JS

React is a library for building composable user interfaces. It encourages the creation of reusable UI components, which present data that changes over time.

HTML and CSS

HTML (the Hypertext Markup Language) and CSS (Cascading Style Sheets) are two of the core technologies for building Web pages. HTML provides the structure of the page, CSS the (visual and aural) layout, for a variety of devices.

Amazon Web Services

Amazon Web Services offers reliable, scalable, and inexpensive cloud computing services. Currently being used for this website, AWS hosts a S3 bucket on Cloudfront's CDN.

Designed with

Figma

Figma is a vector graphics editor and prototyping tool which is primarily web-based, with additional offline features enabled by desktop applications for macOS and Windows.

Tested with Lighthouse

Google Lighthouse

Google Lighthouse is an open-source, automated tool for improving the quality of web pages. You can run it against any web page, public or requiring authentication. It has audits for performance, accessibility, progressive web apps, SEO and more.

Responsive design in mind

Built from the mobile format up, this website makes use of Material UI's grid components with a mixture of React to make a seamless responsive design.

The picture element

With responsive design in mind, this website makes use of the picture html element. This allows support for image fallbacks for a number of different browsers and devices.

Grid structure and media queries

Grid designs and media queries allow easier structure flow across multiple sizes of windows. Resizing the window will change the layout to best suit the viewport.

Ideas/Updates

Next.js

If I would re-make this website for a third time, I would probably start my project with Next.js. Next has a lot of helpful tools out of the box like: responsively rendered image components, api routing for client side, file structure routing, and more. This would save a ton of time optimizing and staging.

About

Updated version of website using newer technology

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published