About This Portfolio

This is a new project by Arthur Tham to practice and explore React. It'll also be a new way to show off a refreshed portfolio. This is a work in progress.

Once the home page is ready, the home page at arttham.com will redirect to this page, while some subpages will still be hosted by the original repository for arttham.com which is on the Jekyll framework.

The original README is below.

Developer Portfolio Template 🚀

What is this?

This simple portfolio template is designed to showcase your past projects, career history, skill sets, and more.

View the Demo.

This template is free to use, and no attribution is required. You can fork or download this repository to customize it for your own use. Please don't forget to leave a ⭐ if you like this portfolio!

Features

✅ Open source (free to use, no attribution required)
✅ Responsive design & mobile-friendly
✅ Supports both dark and light modes
✅ Highly customizable multi-component layout
✅ Built with modern technologies (React, TypeScript, JavaScript, and SCSS)

Quick Setup

1. Ensure you have Node.js installed. Check your installation by running:

   node -v

2. In the project directory, install dependencies:

   npm install

3. Start the development server:

   npm start

4. Open http://localhost:3000 to view the app in the browser.

5. Customize the template by navigating to the /src/components directory. Modify texts, pictures, and other information as needed.

The page will reload if you make edits, and you will see any lint errors in the console.

If you are interested in creating a mockup image like the ones from the personal projects section, I recommend Genmoo. This website lets you generate sleek looking browser mockups for free.

Deployment

You can choose your preferred service (e.g., Netlify, Render, Heroku) for deployment. One of the easiest ways to host this portfolio is using GitHub Pages. Follow the instructions below for a production deploy.

1. Set Up GitHub Repository

   Create a new repository on GitHub for your portfolio app.

2. Configure package.json

   Edit the following properties in your package.json file:

   {
       "homepage": "https://yourusername.github.io/your-repo-name",
       "scripts": {
           "predeploy": "npm run build",
           "deploy": "gh-pages -d build",
           ...
       }
   }

   Replace yourusername with your GitHub username and your-repo-name with the name of your GitHub repository.

3. Deploy to GitHub Pages

   Run the following command to deploy your app:

   npm run deploy

4. Access Your Deployed App

   After successfully deploying, you can access your app at https://yourusername.github.io/your-repo-name.