/siaw.dev

This is the source code for my personal Portfolio Website containing projects i have worked on.

Primary LanguageTypeScriptMIT LicenseMIT

CircleCI

My Portfolio Website

This repository contains the source code for my personal portfolio website. The website showcases the my skills, qualifications, projects, and contact information.

Project Description

The portfolio website serves as a digital resume and showcases the developer's abilities, experience, and projects in an organized and visually appealing manner. It provides visitors with an overview of the developer's background, skills, and accomplishments, making it an effective tool for personal branding and networking.

The website is structured into several sections:

  • Home: A brief introduction.
  • About: A more detailed overview.
  • Skills: An interactive display of the developer's technical skills and proficiencies.
  • Qualification: Information about the developer's educational background and qualifications.
  • Portfolio: Showcase of selected projects with descriptions and links.
  • Project: Detailed information about a featured project, highlighting its objectives, technologies used, and outcomes.
  • Contact: A contact form for visitors to get in touch with the developer.
  • Footer: Additional information, links to social media, and copyright notice.

Tools and Languages Used

The portfolio website is built using modern web development tools and technologies to ensure an engaging and responsive user experience. The following tools, languages, and libraries were used in the project:

  • React: The website is built as a single-page application (SPA) using the React JavaScript library, allowing for efficient component-based development and UI updates.

  • Chakra UI: The website's user interface is styled using the Chakra UI library, which provides a set of customizable and accessible components that follow design best practices.

  • JavaScript (ES6+): JavaScript is the primary programming language used for building interactive and dynamic elements on the website.

  • HTML: The structure and content of the website are defined using HTML (Hypertext Markup Language).

  • CSS: In addition to Chakra UI styles, custom CSS styles are applied to enhance the visual appeal and layout of the website.

  • Git: Version control is managed using Git, allowing for collaboration and tracking changes to the codebase.

  • GitHub: The project is hosted on GitHub, providing a platform for version control, issue tracking, and collaboration.

  • Node.js: Node.js is used to manage dependencies, run development servers, and build the production-ready application.

Usage

To run the portfolio website locally, follow these steps:

  1. Clone the repository: git clone https://github.com/your-username/your-portfolio.git
  2. Navigate to the project directory: cd your-portfolio
  3. Install dependencies: npm install
  4. Start the development server: npm start
  5. Open your web browser and visit: http://localhost:3000

Feel free to explore the different sections of the website, customize the content, and adapt the design to your preferences.

Credits

This project was created and developed by Siaw A. Nicholas.

License

This project is licensed under the MIT License.


For more information about the project, feel free to contact Siaw A. Nicholas.

Available Scripts

In the project directory, you can run:

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

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

npm test

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

npm run eject

Note: this is a one-way operation. Once you eject, you can’t go back!

If you aren’t satisfied with the build tool and configuration choices, you can eject at any time. This command will remove the single build dependency from your project.

Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except eject will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.

You don’t have to ever use eject. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.

npm run lint

To fix syntax and errors and format code