Logan Falkenberg’s Portfolio Site

👋 Welcome! Thanks for checking out my portfolio’s codebase! If you decide to use it, please reference the link back to this repo somewhere visible in your code or documentation. And hey—while you’re at it, drop me a follow on GitHub! Your support genuinely means a lot. 🙌

---

🛠️ Tech Stack

This project harnesses a range of modern tools and technologies:

1. ⚛️ React.js
   Driving the front end, React’s modular structure makes it easy to build and maintain an interactive UI.

2. 🎨 Figma
   I redesigned my resume in Figma (originally made in Canva). I exported it as an SVG to feed into Spline for 3D rendering and hero section animations.

3. 💫 Spline
   Powers interactive 3D elements. I briefly used the premium version to remove watermarks and unlock extra features.

4. 🔥 Firebase
   Hosts the website and ensures things run smoothly for visitors. No more complicated servers—just quick deployment.

5. ⚙️ GitHub Actions
   Every time I push changes, GitHub Actions automatically updates the live site, so you’re always seeing the latest version.

6. 🌐 Namecheap
   Keeps the domain name—loganfalkenberg.com—up and running.

7. 💻 Uiverse.io
   Adds that extra bit of flair with open-source HTML/CSS components and dynamic UI elements.

8. 📧 Email.js
   Handles the contact form functionality, letting users shoot me an email directly from the site.

9. 🛠️ GitKraken
   For version control, I use GitKraken to push/pull the repo. It simplifies git interactions (compared to GitHub Desktop or CLI), especially for large projects like this. GitKraken handles challenges like Git LFS (Large File Storage) seamlessly, making it a highly recommended tool for managing version control efficiently.

---

🚀 Getting Started

Feel free to clone or fork this repo to get it running on your own machine:

1. Clone the Repository

git clone https://github.com/TheTallProgrammer/My-Portfolio-Site

2. Navigate to the Project Directory

cd My-Portfolio-Site

3. Install Dependencies

Make sure Node.js is installed. Then run:

npm install

4. Start the Application

npm run start

🌐 Open http://localhost:3000 in your browser, and you’re good to go!

---

🤝 How to Fork and Pull Changes

Contributions are always welcome! Here’s how you can fork the repo, tinker with the code, and open a pull request:

1. Visit: https://github.com/username/repo-name
2. Click Fork in the upper-right corner.
3. Clone your newly forked repo:

   git clone https://github.com/your-username/repo-name.git

4. Check out the Getting Started steps above.
5. Make your edits. ✏️
6. Push to your forked repo.
7. Create a Pull Request:
   • On your repo page, navigate to Pull requests > New pull request.
   • Compare changes and submit. 🚀

---

🌟 Key Features

• Immersive 3D Scenes using Spline.
• Dynamic UI Components thanks to Uiverse.io.
• Built-In Email Functionality with Email.js (no separate backend needed!).
• Real-Time Deployment via Firebase & GitHub Actions.
• Sleek, Professional Design from Figma & Canva.

---

💰 Project Costs

Just to be transparent, here’s what keeps this project running:

• Spline.io Premium: $10 for a one-month subscription (mainly to remove watermarks and unlock goodies).
• Namecheap Domain: ~$11 per year for loganfalkenberg.com.

🤑 Total Upfront Cost: $21
💸 Ongoing Cost: $11/year

---

📚 Helpful Resources

• React.js Documentation
• Spline
• Uiverse.io
• Email.js
• Firebase Documentation

---

📜 License

This project is licensed under the MIT License. See the LICENSE file for details.

---

🎉 Credits

• Document used for reference and inspiration

---

Thanks for stopping by! ✌️ Let me know if you have questions or feedback. 💬