ThinkDifferent
/
Academic-Professional-Portfolio-Template
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
Academic Portfolio for St.Thomas Institute for Science & Technology. Developed using gatsby.js https://stistportfolio.web.app/
10 Commits 1 Branch 0 Tags 129 MiB
TypeScript 63.2%
MDX 36.8%
Go to 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
LICENSE Initial commit 2024-02-07 14:14:11 +00:00
README.md Initial Commit 2024-02-07 16:06:03 +00:00
gatsby-config.ts Initial Commit 2024-02-07 20:28:35 +05:30
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
tsconfig.json Initial Commit 2024-02-07 20:28:35 +05:30

README.md

LekoArts

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.