kadenfrisk.com

Table of Contents

• Overview
• Features
• Pages
• Technologies Used
• Getting Started
• Development
• Deployment
• Contributing
• License
• Contact

Overview

kadenfrisk.com is my personal website for showcasing everything I've made, all my services, and all of my blog posts.

Originally this website was only for selling more websites, but as I began to create more and more projects, I realized that I needed a place to "hub" to connect them all. One of the biggest things I've been working on are courses to help others learn programming. I want to help others find the resources they need to learn programming entirely free of charge.

I will soon add more about myself here, but for now my main focus is finishing my existing projects and creating more courses.

Pages

Home Page

• URL: https://kadenfrisk.com/
• Description: The home page of my website, where it all begins.
• Key Elements:
  • Showcases all my website, repositories, and courses.
  • Has clean and simple animations.

page name (Template for adding more pages)

• URL: /[page-url]
• Description: Brief description of the page's purpose
• Key Elements:
  • Element 1
  • Element 2
  • Add more key elements as needed

Home

• URL: /
• Description: Main page for the website, where it all begins.
• Key Elements:
  • Fancy hero section
  • A little section about me
  • Special use of the github API to show my repositories
  • A section for my courses
  • A section for people who need websites

Contact

• URL: /contact
• Description: Page just for contacting me
• Key Elements:
  • All my contact options
  • An interactive contact form
  • Uses the mailgun API to send emails

Technologies Used

• Frontend: React.js, TypeScript
• Routing: React Router
• Styling: SCSS and Tailwind CSS with some custom CSS.
• Build Tool: Vite
• Linting: ESLint
• Icons: Lucide, and Simple Icons
• Hosting: Cloudflare Pages
• CI/CD: GitHub Actions
• UI Library: shadcn/ui

Getting Started

Prerequisites

• Node.js (version X.X.X or higher)
• npm package manager

Installation

1. Clone the repository Using git:

   git clone https://github.com/ofluffydev/Personal-Website-V2.git
   

   Using GitHub CLI:

   gh repo clone ofluffydev/Personal-Website-V2
   

2. Navigate to the project directory

   cd Personal-Website-V2
   

3. Install dependencies using Yarn or npm

   yarn install
   

    npm install
   

Development

To start the development server:

With Yarn:

yarn dev

With npm:

npm run dev

This will start the application on http://localhost:5173 (or another port if 5173 is in use).

Linting

To run the linter (ESLint):

With Yarn:

yarn lint

With npm:

npm run lint

Deployment

As with most vite projects, you can build the project using the following: With Yarn:

yarn build

With npm:

npm run build

You can also preview it with yarn preview or npm run preview

Contributing

I'm not actively looking for contributors at the moment, but if you have any suggestions or improvements, feel free to open an issue or a pull request.

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

License

This project is licensed under the [LICENSE NAME] - see the LICENSE.md file for details.

Contact

All my contacts are on the website at https://kadenfrisk.com/contact

---

[Optional: Add badges, screenshots, or any other relevant information about your project]