ThinkDifferent/Academic-Professional-Portfolio-Template

Fork 0

Academic Portfolio for St.Thomas Institute for Science & Technology. Developed using gatsby.js https://stistportfolio.web.app/

Find a file

igr1zera fac7de3c85 Footer Updated		2024-02-09 08:47:41 +00:00
node_modules	Footer Updated	2024-02-09 08:47:41 +00:00
src	Initial Commit	2024-02-07 20:28:35 +05:30
static	Initial Commit	2024-02-07 20:28:35 +05:30
.npmrc	Initial Commit	2024-02-07 20:28:35 +05:30
.nvmrc	Initial Commit	2024-02-07 20:28:35 +05:30
gatsby-config.ts	Initial Commit	2024-02-07 20:28:35 +05:30
LICENSE	Initial commit	2024-02-07 14:14:11 +00:00
package-lock.json	Initial Commit	2024-02-07 20:28:35 +05:30
package.json	Initial Commit	2024-02-07 20:28:35 +05:30
README.md	Initial Commit	2024-02-07 16:06:03 +00:00
tsconfig.json	Initial Commit	2024-02-07 20:28:35 +05:30

README.md

Gatsby Starter Portfolio: Cara (Modified For Academic Professionals at STIST)

Playful and Colorful One-Page portfolio featuring Parallax effects and animations. Using the Gatsby Theme @lekoarts/gatsby-theme-cara.

Demo Website

✨ Features

Theme UI-based theming
react-spring Parallax Effect
CSS Animations on Shapes

🚀 Getting Started

1. Create a Gatsby site.

Before starting, install the npm module and Gatsby cli ....

Use the Git CLI to clone or fork the site and install dependencies:

git clone https://git.disroot.org/gabinroy/Academic-Professional-Portfolio-Template.git

2. Navigate to your new project.

cd Academic-Professional-Portfolio-Template

3. Open the code and start customizing!

Start the site by running npm start.

Your site is now running at [http://localhost:8000](http://localhost:8000)!

Make the production ready page using npm run build.

📝 Using and modifying this starter

Important Note: Please read the guide Shadowing in Gatsby Themes to understand how to customize the underlying theme!

Have a look at the theme's README and files to see what options are available and how you can shadow the various components including Theme UI. Generally speaking you will want to place your files into src/@lekoarts/gatsby-theme-cara/ to shadow/override files. The Theme UI config can be configured by shadowing its files in src/gatsby-plugin-theme-ui/.

Changing content

The content of this project is defined in four .mdx files inside the theme's sections folder. You can override the files intro.mdx, projects.mdx, about.mdx and contact.mdx. This starter has overridden all files for you already.

You have to use the <ProjectCard /> component inside projects.mdx to display the cards. Example:

## Projects

<ProjectCard title="Freiheit" link="https://www.behance.net/gallery/58937147/Freiheit" bg="linear-gradient(to right, #D4145A 0%, #FBB03B 100%)">
This project is my entry to Adobe's #ChallengeYourPerspective contest.
</ProjectCard>

Change your header file at gatsby-config.ts

Make the appropriate changes in the gatsby-config.ts file to update the header data.

🎓 Learning Gatsby

Looking for more guidance? Full documentation for Gatsby lives on Gatsby's website.