https://github.com/zdodson21/my-website

My personal website made using OpenWC
https://github.com/zdodson21/my-website

lit open-wc vercel-deployment website

Last synced: 3 months ago
JSON representation

My personal website made using OpenWC

• Host: GitHub
• URL: https://github.com/zdodson21/my-website
• Owner: zdodson21
• License: mit
• Created: 2024-09-05T18:00:17.000Z (9 months ago)
• Default Branch: main
• Last Pushed: 2024-10-10T19:18:07.000Z (8 months ago)
• Last Synced: 2025-01-15T08:39:49.178Z (5 months ago)
• Topics: lit, open-wc, vercel-deployment, website
• Language: JavaScript
• Homepage: https://zach-dodson-website.vercel.app/
• Size: 1.24 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# README.md

## Scripts

- `start` runs your app for development, reloading on file changes

- `start:build` runs your app after it has been built using the build command.

  - `sh start-build.sh` runs `build` then `start:build` commands back to back.

- `build` builds your app and outputs it in your `dist` directory

- `test` runs your test suite with Web Test Runner

- `lint` runs the linter for your project

- `format` fixes linting and formatting errors

## Tools used in this project

* Framework

  * [Lit](https://lit.dev/) / [OpenWC](https://open-wc.org/)

    * HTML

    * CSS

    * JavaScript

* Web Hosting

  * [Vercel](https://vercel.com/home) 

## Components + Hierarchy

* `site-desktop.js` - Head component for whole project.

  * `desktop-environment.js` - Container for all desktop related items.

    * `environment-item.js` - Items that appear on desktop with custom icons and names. Can be folders or "app" shortcuts.

    * `environment-window.js` - Application window, will provide interface for variety of "apps" and folder system.

  * `desktop-taskbar.js` - Head taskbar component.

    * `taskbar-start.js` - Start button, opens `start-menu.js`.

      * `start-menu.js` - Houses apps and other things that can be opened.

        * `menu-item.js` - Item in start menu.

    * `taskbar-item.js` - Open application that will appear in taskbar.

    * `taskbar-clock.js` - Working clock that appears in bottom right of taskbar.

* `site-store.js` - State management store for all components.

## Tooling configs

For most of the tools, the configuration is in the `package.json` to reduce the amount of files in your project.

If you customize the configuration a lot, you can consider moving them to individual files.