Skip to content

Commit

Permalink
Merge pull request #1 from andrecrjr/feature/about-me-improvement
Browse files Browse the repository at this point in the history
Feature/about me improvement
  • Loading branch information
andrecrjr authored Apr 9, 2024
2 parents d2cfa45 + cdd1e29 commit 655270d
Show file tree
Hide file tree
Showing 29 changed files with 341 additions and 99 deletions.
3 changes: 3 additions & 0 deletions .eslintrc.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,5 +2,8 @@
"extends": "next/core-web-vitals",
"env": {
"jest": true
},
"rules": {
"react/no-unescaped-entities":"off"
}
}
4 changes: 2 additions & 2 deletions .github/workflows/deploy.yml
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
# This workflow will do a clean install of node dependencies, cache/restore them, build the source code and run tests across different versions of node
# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions

name: Node.JS CI - Deploy static
name: Deploy Portfolio's Static - NodeJS CI

on:
push:
Expand All @@ -15,7 +15,7 @@ jobs:

strategy:
matrix:
node-version: [14.x]
node-version: [18.x]
# See supported Node.js release schedule at https://nodejs.org/en/about/releases/

steps:
Expand Down
File renamed without changes.
8 changes: 4 additions & 4 deletions components/Layout/Header/index.tsx
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
import React from 'react';
import { GlobalHeader } from './style';
import { GlobalHeader } from './Header.style';
import Link from 'next/link';
import { MenuLink } from './style';
import { MenuLink } from './Header.style';

const Header = () => {
return (
<GlobalHeader>
<h1 className="header--logo">ACJRHUB</h1>
<Link href="/" passHref><a style={{textDecoration:"none"}}><h1 className="header--logo">ACJRHUB</h1></a></Link>
<nav className="header--menu">
<Link href="#about-me" passHref>
<MenuLink>About Me!</MenuLink>
<MenuLink>About Me</MenuLink>
</Link>
<Link href="#portfolio" passHref>
<MenuLink>Portfolio</MenuLink>
Expand Down
8 changes: 4 additions & 4 deletions components/Layout/Stacks.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,11 +16,11 @@ export const Stacks = () => {
viewBox="0 0 291.31 291.31"
>
<path
fill="#d99666"
fill="#994a12"
d="M9.099 0h273.112L254.9 263.999 154.759 291.31h-18.207L36.41 263.999 9.099 0z"
/>
<path
fill="#f4b459"
fill="#966118"
d="M145.655 27.302h100.141l-18.207 209.386-81.933 27.311c-.001 0-.001-236.697-.001-236.697z"
/>
<path
Expand Down Expand Up @@ -63,7 +63,7 @@ export const Stacks = () => {
target={'_blank'}
>
<svg viewBox="0 0 128 128">
<path fill="white" d="M1.408 1.408h125.184v125.185H1.408z"></path>
<path fill="yellow" d="M1.408 1.408h125.184v125.185H1.408z"></path>
<path
fill="#323330"
d="M116.347 96.736c-.917-5.711-4.641-10.508-15.672-14.981-3.832-1.761-8.104-3.022-9.377-5.926-.452-1.69-.512-2.642-.226-3.665.821-3.32 4.784-4.355 7.925-3.403 2.023.678 3.938 2.237 5.093 4.724 5.402-3.498 5.391-3.475 9.163-5.879-1.381-2.141-2.118-3.129-3.022-4.045-3.249-3.629-7.676-5.498-14.756-5.355l-3.688.477c-3.534.893-6.902 2.748-8.877 5.235-5.926 6.724-4.236 18.492 2.975 23.335 7.104 5.332 17.54 6.545 18.873 11.531 1.297 6.104-4.486 8.08-10.234 7.378-4.236-.881-6.592-3.034-9.139-6.949-4.688 2.713-4.688 2.713-9.508 5.485 1.143 2.499 2.344 3.63 4.26 5.795 9.068 9.198 31.76 8.746 35.83-5.176.165-.478 1.261-3.666.38-8.581zM69.462 58.943H57.753l-.048 30.272c0 6.438.333 12.34-.714 14.149-1.713 3.558-6.152 3.117-8.175 2.427-2.059-1.012-3.106-2.451-4.319-4.485-.333-.584-.583-1.036-.667-1.071l-9.52 5.83c1.583 3.249 3.915 6.069 6.902 7.901 4.462 2.678 10.459 3.499 16.731 2.059 4.082-1.189 7.604-3.652 9.448-7.401 2.666-4.915 2.094-10.864 2.07-17.444.06-10.735.001-21.468.001-32.237z"
Expand All @@ -90,7 +90,7 @@ export const Stacks = () => {
rel="noreferrer"
target={'_blank'}
>
<svg viewBox="0 0 128 128">
<svg viewBox="0 0 128 128" style={{fill:"white"}}>
<path d="M64 0C28.7 0 0 28.7 0 64s28.7 64 64 64 64-28.7 64-64S99.3 0 64 0zm32.7 114.4L48.4 41.8h-6.8v50.1h6.8V55.3l44.2 61.5c-8.5 4.6-18.2 7.2-28.6 7.2-33.2.1-60.1-26.8-60.1-60S30.8 3.9 64 3.9s60.1 26.9 60.1 60.1c0 21.1-10.9 39.7-27.4 50.4z"></path>
<path d="M78.6 73.3l7.5 11.3V41.8h-7.5z"></path>
</svg>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,14 +3,21 @@ import styled from 'styled-components';
import { Presentation } from '../styles';

export const AboutMeContainer = styled(Container)`
background: #366186;
background-color: ${(props) => props.theme.colors.backgroundAboutMe};
color: white;
overflow: hidden;
`;
@media screen and (min-width:768px) {
display:grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto 1fr auto;
gap: 2rem;
padding: 0 6rem 1rem 6rem;
}
`;

export const AboutMePresentation = styled(Presentation)`
margin-bottom: 2rem;
position: relative;
padding-left: 50px;
&:not(.title) {
margin-bottom: 5rem;
max-width: 768px;
Expand All @@ -36,4 +43,9 @@ export const AboutMePresentation = styled(Presentation)`
}
`;

export const AboutMePresentationContainer = styled(PresentationContainer)``;
export const AboutMePresentationContainer = styled(PresentationContainer)`
grid-column-start: 1;
grid-column-end: span 2;
justify-content: unset;
height:fit-content;
`;
7 changes: 6 additions & 1 deletion components/Pages/AboutMe/AboutMe.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,10 @@
[
{"description":"As a System Analyst with a Bachelor's degree in Information Systems in years of experience as a Fullstack Developer, my passion lies in creating simple engaging and dynamic front-end experiences that delight users."},
{"description":"As someone who has fallen in love with blockchain technology, cryptocurrencies, and AI, I am excited about the potential of these technologies to work together and shape the decentralized future of Web 3.0."},
{"description": "In my free time, I enjoy indulging in my hobbies of watching anime, reading manga, and playing games like Terraria and Metroidvania games, which allow me to escape into fantastic worlds and explore new realities."}
{"description": "In my free time, I enjoy indulging in my hobbies of watching anime, reading manga, and playing games like Terraria and Metroidvania games, which allow me to escape into fantastic worlds and explore new realities."},
{"skills":{
"HTML":75,
"CSS":75,
"JS":80
}}
]
53 changes: 53 additions & 0 deletions components/Pages/AboutMe/Experience/Experience.style.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
import styled from "styled-components";


export const ExperienceSection = styled.section`
width:"100%";
display:flex;
flex-direction: column;
.experience__description{
font-size: 1rem;
}
.experience__section{
margin-top:2rem;
h5{
font-size: 1.25rem;
}
.experience__role{
margin-bottom:0.9rem;
}
ul{
padding-left:1.3rem;
}
.experience__section--paragraph{
font-size: 1.1rem;
margin-top: 1rem;
}
}
.experience__section--button{
margin-top: 4rem;
background:unset;
border:2px solid white;
color:white;
padding:16px;
border-radius: 8px;
font-size: 1rem;
font-weight:bold;
cursor:pointer;
display:flex;
width:fit-content;
text-decoration: none;
align-self:center;
&:hover{
transform: scale(105%);
}
}
`

export const ExperienceTitle = styled.h4`
margin-bottom:0.9rem;
font-size: 1.3rem;
`
59 changes: 59 additions & 0 deletions components/Pages/AboutMe/Experience/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
import React from "react";
import { ExperienceSection, ExperienceTitle } from "./Experience.style";

type Props = {};

const Experience = (props: Props) => {
return <ExperienceSection data-aos="fade-up">
<ExperienceTitle>Experiences</ExperienceTitle>
<section className="experience__section">
<h5>Front-End Developer Mid-Level at Editora Globo</h5>
<p className="experience__role">2019 / current role</p>
<p style={{"marginBottom":"1rem"}}>
Currently collaborating with the O Globo Project team to enhance engagement and drive new users directly to the websites,
particularly the <a href="">O Globo Newspaper website</a> one of the most famous news portal in Brazil.
</p>
<details>
<summary>More about this role</summary>
<ul>
<li className="experience__section--paragraph">
<p>Tech Stack Enhancement: Integrated Python and NodeJS microservices,
React with Redux-form, and Sass for
advanced CMS functionalities and front-end development.
</p>
</li>
<li className="experience__section--paragraph">
<p>CI/CD Expertise: Gained proficiency in CI/CD pipelines using GitLab CI and GitHub Actions, enhancing the development process. </p>
</li>
<li className="experience__section--paragraph">
<p>Agile Methodologies: Demonstrated flexibility in project management by adeptly employing both Scrum and Kanban frameworks.</p>
</li>
<li className="experience__section--paragraph">
<p>SEO Optimization: Leveraged Google Search Console to refine the CMS, boosting search engine visibility and indexing health by over 90%.</p>
</li>
<li className="experience__section--paragraph">
<p>Design Collaboration: Worked closely with UX/UI teams to faithfully execute design specifications using Zeplin, Adobe XD, and Figma.</p></li>
<li className="experience__section--paragraph">
<p>Design to Development: Consistently translated design concepts into functional user interfaces, ensuring fidelity to original layouts.</p></li>
</ul>
</details>
</section>
<section className="experience__section">
<h5>Web Developer Trainee at Editora Globo</h5>
<p className="experience__role">2018 / 2019</p>
<p style={{"marginBottom":"1rem"}}>Worked to maintain the legacy content management as a fullstack trainee</p>
<details>
<summary>More about this role</summary>
<ul>
<li className="experience__section--paragraph">
<p>Legacy System Revitalization: Enhanced legacy systems using Django and Python 2.7, acquiring expertise in established technologies.</p></li>
<li className="experience__section--paragraph"><p>Front-End Leadership: Led the creation of user interfaces with Less and Vanilla Javascript, merging practicality with aesthetic design.</p></li>
<li className="experience__section--paragraph"><p>Technological Adaptability: Overcame the intricacies of older tech stacks, mastering Django, Python 2.7, Less, and Vanilla Javascript.</p></li>
</ul>
</details>
</section>
<a href="#" className="experience__section--button">Download my complete resumé</a>
</ExperienceSection>;
};

export default Experience
1 change: 1 addition & 0 deletions components/Pages/AboutMe/Skill/Skill.style.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export {}
10 changes: 10 additions & 0 deletions components/Pages/AboutMe/Skill/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import React from "react";

const Skill = () => {
return <section data-aos="fade-up">
<h4>Skill</h4>
<p>Work in Progress!</p>
</section>;
};

export default Skill
18 changes: 7 additions & 11 deletions components/Pages/AboutMe/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,22 +3,18 @@ import {
AboutMeContainer,
AboutMePresentation,
AboutMePresentationContainer
} from './style';
import Aboutme from './AboutMe.json';
} from './About.style';
import Skill from './Skill';
import Experience from './Experience';

export const AboutMe = () => {
return (
<AboutMeContainer id="about-me">
<AboutMePresentationContainer>
<AboutMePresentation className="title">About me!</AboutMePresentation>
<AboutMePresentationContainer data-aos="fade-up">
<AboutMePresentation className="title"><h2>About me!</h2></AboutMePresentation>
</AboutMePresentationContainer>
{Aboutme.map((item, index) => {
return (
<AboutMePresentation key={index}>
<p data-aos="fade-left">{item.description}</p>
</AboutMePresentation>
);
})}
<Experience/>
<Skill />
</AboutMeContainer>
);
};
10 changes: 2 additions & 8 deletions components/Pages/MainPage/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export default function MainPage({}): ReactElement {
<PresentationContainer>
<Presentation data-grid="welcome-grid" data-aos="fade-up">
<h2 className="presentation--world">
Hello World, I am <strong>André Junior</strong>
Hello World, I am <strong>André Carlos Junior</strong>
</h2>

<SocialNetworkContainer>
Expand All @@ -31,12 +31,6 @@ export default function MainPage({}): ReactElement {
socialNetworkName={'insta'}
/>
</li>
<li>
<SocialNetwork
socialNetworkHref={'twitter.com/acjuni0r'}
socialNetworkName={'twitter'}
/>
</li>
<li>
<SocialNetwork
socialNetworkHref={'github.com/andrecrjr'}
Expand All @@ -48,7 +42,7 @@ export default function MainPage({}): ReactElement {
<Presentation data-grid="stack-grid" data-aos="fade-up">
<MyStackContainer>
<h2 className="presentation--world">
Front-end Developer and NodeJS Lover!
Front-end Developer, Python-like and geek love 🤓!
</h2>
<Stacks />
</MyStackContainer>
Expand Down
52 changes: 42 additions & 10 deletions components/Pages/Portfolio/Portfolio.json
Original file line number Diff line number Diff line change
@@ -1,25 +1,57 @@
[
{
"projectName":"Steam ON",
"projectImage":"",
"projectDescription":"",
"projectTags":["React","Typescript","NextJS 14", "Shadcn/ui", "Tailwind"],
"projectURL":"",
"githubUrl":"",
"inProgress":true
},
{
"projectName":"Wakatime Next Auth",
"projectImage":"",
"projectDescription":"",
"projectTags":["npm","Typescript","NextJS"],
"projectURL":"https://www.npmjs.com/package/wakatime-next-auth",
"githubUrl":"https://github.com/andrecrjr/wakatime-provider-next-auth",
"inProgress":true
},

{
"projectName":"Coineko",
"projectImage":"/img/projects/coineko.png",
"projectDescription":"",
"projectTags":["React","Javascript","Rest API", "Vite"],
"projectURL":"https://coineko.vercel.app/",
"githubUrl":"https://github.com/andrecrjr/coineko",
"inProgress":true
},
{
"projectName":"Spotiflex",
"projectImage":"/img/spotiflex.png",
"projectImage":"/img/projects/spotiflex.png",
"projectDescription":"",
"projectTags":["NextJS","Typescript", "Rest API"],
"projectURL":"https://spotiflex.vercel.app/",
"inProgress":true
"githubUrl":"https://github.com/andrecrjr/spotiflex",
"inProgress":false
},
{
"projectName":"Animebonds",
"projectImage":"/img/animebonds.png",
"projectImage":"/img/projects/animebonds.png",
"projectDescription":"",
"projectTags":["React","Javascript","Apollo Graphql", "Vite"],
"projectURL":"https://animebonds.surge.sh/",
"inProgress":true
},{
"projectName":"Coineko",
"projectImage":"",
"githubUrl":"https://github.com/andrecrjr/animebonds",
"inProgress":false
},
{
"projectName":"Banano Miner Watch",
"projectImage":"/img/projects/banano-miner-watch.png",
"projectDescription":"",
"projectTags":["React","Javascript","Rest API", "Vite"],
"projectURL":"https://coineko.surge.sh/",
"inProgress":true
"projectTags":["Javascript", "REST API", "Browser AddOn", "Extension"],
"projectURL":"https://chrome.google.com/webstore/detail/bananominer-watch/pdnkikfbjfhikkpopfoaihhfbhaplpfc",
"githubUrl":"https://github.com/andrecrjr/bananominer-watch",
"inProgress":false
}
]
Loading

0 comments on commit 655270d

Please sign in to comment.