Giter Club home page Giter Club logo

portfolio's Introduction

Logo

Personal portfolio

Site preview

My design portfolio to showcase a few projects. Built with Remix, Three.js, and Framer Motion. View the live site or check out a live version of the components storybook.

Install & run

Make sure you have nodejs 19.9.0 or higher and npm 9.6.3 or higher installed. Install dependencies with:

npm install

Once it's done start up a local server with:

npm run dev

To view the components storybook:

npm run dev:storybook

Deployment

I've set up the site using Cloudflare for hosting. Deploy the site to Cloudflare Pages:

npm run deploy

Permissions

I'm cool with anyone using the code or parts of the code for their own site, it is open source so people can learn from it and adapt it. However, I would encourage you to modify the theme and components it to make it your own. If you are using the site's design largely unmodified, I'd appreciate being credited as the designer of the website.

I do not give permission to present any of my projects as your own (this is being actively used as my portfolio site and these are my real projects I've worked on).

FAQs

How do I change the color on the DisplacementSphere (blobby rotating thing in the background).

You'll need to edit the fragment shader. Check out this issue for more details.

How do I get the contact form to work?

To get the contact form working create an AWS account and set up SES (Simple Email service). Then plug in your details into .dev.vars.example and rename it to .dev.vars. You'll also need to add these as enviroment variables in the Cloudflare dashboard for it to work in production. Or if you don't mind sending through gmail use nodemailer instead.

portfolio's People

Contributors

dependabot[bot] avatar hamishmw avatar rutkuli avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

portfolio's Issues

Contact Page 404 NOT FOUND

I'm not sure if the Contact page is mean to redirct to the 404 Page
I briefly checked code, it seems all good
but not sure why it cannot redirect to the correct Contact page
1658611866758

Vercel Deployment Help

Need help in deploying the current in Vercel, every build passes but I face

SyntaxError: Named export 'renderToReadableStream' not found. The requested module 'react-dom/server' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from 'react-dom/server';
const { renderToReadableStream } = pkg;

Inquiry

Hello!
This webpage seems to be not live now.
Please check on this, ser
Thanks.

Double routerlink in Intro.js?

Hey, you seem to have the <RouterLink href="/#project-1"> twice in the Home/Intro.js file at the bottom, are you doing this for a reason, or is this just by accident?
image

webpack building error

Hey, would you know why this error is appearing for me? I cannot seem to make it build correctly on localhost. dev works fine.

Commands I'm using: npm run build

image

Contact page 404 NOT FOUND

I'm not sure if the Contact page is mean to redirct to the 404 Page
I briefly checked code, it seems all good
but not sure why it cannot redirect to the correct Contact page
1658611866758
its also same as the uses page

Using the code

Can I use parts of the site for a client project? I understand that this design is currently in use.

ReferenceError: crypto is not defined

First of all thanks for this amazing project. I have installed the node_modules, and run:
npm run dev
and I am facing this error:

Screenshot 2024-02-27 at 4 34 59 PM

Any help would be much appreciated. Thanks

npm install error

hello. i have issues so when i enter npm install command throw me this errors
Screenshot (788)

whats the reason?
and how can i fix this

Icon

How to change icon on the pages

Contact

Hello, it seems like there is a link issue in the contact page. It shows 404 (REDACTED) error on Contact click

[SYNTAX ERROR]: Selector ":root" is not pure (pure selectors must contain at least one local class or id)

At first everything worked fine. After modifying the code, converted globals.css into globals.scss etc all of a sudden ALL of the .css files can't compile, giving me this error:

image

I haven't modified Any of the .css files.

On a side note, how can a plain old .css file contain nested css attributes? I've seen that only in SASS/SCSS, never pure css.

How to fix this issue?

EDIT: after further researching I'm 99% sure this is because of tailwindcss and its postcss.config.js plugin. Something is causing this conflict and the Hamish's code can't compile if tailwindcss is used.

Anyone knows how to use tailwindcss in this project?

An error occurs when viewing your site from the Brave browser.

Hello, your portfolio is very cool and I'm learning a lot from it.
However, I'm having trouble viewing your site (https://hamishw.com/) on the Brave browser, as it seems to result in an error that prevents the site from displaying.
This issue also arises while I'm studying your site. When I checked the console, it seems like the error is being caused by THREE.WebGLRenderer.

I would appreciate your help. Thank you.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.