Giter VIP home page Giter VIP logo

liushelly-com's Introduction

Hi, I'm Mike! โœŒ๐Ÿฝ

I'm a software engineer specializing in front-end and UI/UX. I like to design and build web apps, play instruments, annoy my friends on Discord, and make YouTube videos on occasion.

About me!

  • ๐ŸŽ“ Recent first-generation computer science graduate
  • โšก๏ธ Currently full-stack dev @ Socials by Shelly
  • ๐Ÿ”ฅ Previously UI/UX lead @ ACM at CSUF, front-end dev @ TuffyHacks
  • โš™๏ธ My go-to technologies are React, TypeScript, Tailwind, and more!

Wanna get in touch? Send me a message! ๐Ÿ“จ

liushelly-com's People

Contributors

dependabot[bot] avatar mikeploythai avatar

Stargazers

 avatar  avatar

Forkers

visioninhope

liushelly-com's Issues

Fix canonical tags

The canonical metadata tag is not properly configured for the dynamic portfolio paths and the privacy policy

image image

Change tag from article to anchor

I was suggested to change the article tag to an a tag for better accessibility.

The reason why I made it an article in the first place is because they can be used to represent interactive widgets according to MDN. I would consider the card to be an interactive widget, but I plan to look into this further to improve the accessibility of the website :)

image

The website is un-usable when JavaScript is disabled

When someone disables JS in their browser, the main contents of the website will not render, with only the header and the footer rendering.

The main reason why the contents don't render without JS is because we use Framer Motion to handle page transitions and page animations; the contents would be considered a client component due to being wrapped by Framer's motion element, so it would not work without JS enabled.

I've thought about dropping Framer mid-development just so each page could render out without JavaScript, but we didn't like how routes transitioned between each other all statically. Additionally, since her user-base is mostly coming from mobile, and most likely haven't gone out of their way to disable JavaScript in their browser's settings, it didn't really make sense to put extra thought into it, at least for the time being.

A worry I do still have by keeping Framer is how it would affect SEO. Since each page fades in from an opacity of 0 to 100, I'm concerned if the opacity starting at 0 would be enough of a problem to negatively impact the website's SEO.

PROS OF REMOVING FRAMER

  1. Better SEO (?) since each page will render out immediately
  2. The main contents would be considered server components, and will render out even with JS disabled

CONS OF REMOVING FRAMER

  1. Transitioning between pages feels lifeless. We do wanna give the website personality after all
  2. Even if the main contents render out with JS disabled, any client component (ex. the nav menu button, the cards that open up a modal) wouldn't work. Although, I must acknowledge that this could be mitigated if I rewrote the logic and utilize Next's route interception feature

I'm mostly writing all of this out and putting it up just so I can reference this in the future if I do decide to do something about it. Also up in the case that a random (and friendly) person with much more knowledge about this stuff than me can chime in w/ their perspective lmfao

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.