jme9
2.4 KiB
Jesse M. Ellis - Development notebook for my personal website.
Note: Revision 1 will be developed from 11/24/2024 to 12/11/2024.
Table of Contents
11/24/2024 - First things first
The point of this website is to build a personal website that highlight's personal projects using concepts we've learned in Caterina Paun's Intro to WebDev at PSU. I am going to attempt to create something that is more oriented toward my personal game development endeavours by theme-ing the website with elements from LunaLight. I will highlight some of the milestones in that project as well as other projects I have done.
Some technical constraints
To check the boxes around concepts learned in WebDev this site should be built using the following:
- HTML
- CSS
- JavaScript
- GitHub pages for deployment
High Level Implementation Plan
Concept: This will be a single-page scrolling website with a fixed navigation bar that alows the user to jump to sections.
-
Sketch a layout design for the following required sections:
- Navbar: Fixed at the top.
- About: Brief introduction and a professional photo.
- Previous Work: Resume highlights or course/skills section.
- Projects: Showcase 2-3 projects with links to GitHub/deployed sites.
- Contact: Form for user inquiries.
-
Build basic HTML structure to represent each section.
-
Style the website with CSS.
-
Implement website interactivity with Javascript.
- Scrolling
- Form validation
- Email contact
- Embedded YouTube Video
-
Test, Refine and Repeat (steps 3-5)
-
Deployment with GitHub pages (we'll worry about this when we get there)
A starting point
Just to get things going I'm going to bring some initial files that create a form with user input functionality.
form.html, form.js and styles.css
These files create a simple form that gets user input and prints it to the console. We will build the entire website from here ;)
11/25/2024 - Design
Here's a quick design sketch that captures te aesthetic of the site and some styling. I want the site to mainy highlight my current retro-style game ev project so I think using some pixel art fro mthat as the background is a cool idea.
Note: I did this in procreate, which is not great for this sort of thing.
