https://github.com/joeyonng/joeyonng-backyard
Joeyonng's backyard (personal website) built to mimic the macOS Big Sur desktop. https://joeyonng.github.io
https://github.com/joeyonng/joeyonng-backyard
bigsur css desktop-ui html javascript macos personal-website react
Last synced: about 2 months ago
JSON representation
Joeyonng's backyard (personal website) built to mimic the macOS Big Sur desktop. https://joeyonng.github.io
- Host: GitHub
- URL: https://github.com/joeyonng/joeyonng-backyard
- Owner: Joeyonng
- Created: 2021-05-28T03:09:36.000Z (about 4 years ago)
- Default Branch: master
- Last Pushed: 2022-03-24T09:44:28.000Z (about 3 years ago)
- Last Synced: 2025-04-04T15:02:07.602Z (2 months ago)
- Topics: bigsur, css, desktop-ui, html, javascript, macos, personal-website, react
- Language: JavaScript
- Homepage:
- Size: 90.2 MB
- Stars: 3
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Joeyonng's Backyard
This repository houses the source code of Joeyonng's personal backyard, and it is live on https://joeyonng.github.io/.
As time goes by, I will throw more features, applications and maybe personal stories to my backyard.
## Why
This site serves as my personal website, as well as a demo for the component library [react-big-sur][1] that I built for
fun.
This site is still in an early development and is far from a perfect copy of the real desktop experience (also lots of
bugs), but I already got lots of joys developing it.
[1]: https://github.com/Joeyonng/react-big-sur
## Related Works
If you like the design of my backyard, please also check out these awesome repositories, which are very helpful in my
development of my backyard.
- The idea is heavily inspired by [winXP][2], from which I learned how to switch between different Apps.
- It turns that I am not the first one to think of implementing web based macOS Big Sur UI. [macos-web][3] and
[playground-macos][4] are two finner, more efficient and more professional implementations of the same idea.
- The dock is adapted from [react-osx-dock][5]. I never thought state can be used to do the animations frame by frame.
[2]: https://github.com/ShizukuIchi/winXP
[3]: https://github.com/PuruVJ/macos-web
[4]: https://github.com/Renovamen/playground-macos
[5]: https://github.com/lukehorvat/react-osx-dock