Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit bcf655e

Browse files
rccyxrccyx
committed
refactor: move pupl fiction ref to its own component
1 parent 37b58bd commit bcf655e

File tree

6 files changed

+109
-78
lines changed

6 files changed

+109
-78
lines changed

‎public/blogs/software-quality.mdx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
title: Code Quality
33
seoTitle: How to maintain the highest code quality for your projects ?
44
summary: How to maintain the highest code quality for your projects ?
5-
isReleased: true
5+
isReleased: false
66
isSequel: false
77
lastModDate: 2022-01-02T09:15:00-0401
88
firstModDate: 2022-01-02T09:15:00-0401
@@ -12,4 +12,4 @@ tags:
1212
- 'skill-issues'
1313
---
1414

15-
<H2>This Blog is not yet to be migrated</H2>
15+
<H2>This Blog is not yet to be migrated with MDX</H2>

‎src/app/(pages)/about/page.tsx‎

Lines changed: 27 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,14 @@
11
'use client';
2-
import { PUBLIC_BLOG_IMAGES_SOURCE } from '@/lib/constants';
32
import Footer from '@/app/components/footer/footer';
43
import { motion } from 'framer-motion';
5-
import { Skeleton } from '@/app/components/ui/skeleton';
64
import { cn } from '@/lib/utils';
7-
import React, { Suspense } from 'react';
8-
import { SITE_NAME } from '@/lib/constants';
5+
import React from 'react';
6+
import { SITE_NAME, REPO_SOURCE } from '@/lib/constants';
97
import { GlowingText } from '@/app/components/reusables/content';
108
import NextLink from 'next/link';
119
import { ReactNode } from 'react';
1210

13-
const FrontEnd = [
11+
const ThisSiteTools = [
1412
'TypeScript',
1513
'ReactJS',
1614
'NextJS',
@@ -59,59 +57,12 @@ export default function Page() {
5957
return (
6058
<>
6159
<div className="mt-12"></div>
62-
<motion.div
63-
animate={{
64-
opacity: 1,
65-
x: 0,
66-
}}
67-
initial={{
68-
opacity: 0,
69-
x: 20,
70-
}}
71-
transition={{
72-
duration: 0.2,
73-
ease: 'easeInOut',
74-
}}
75-
className="mx-auto w-full px-5 max-w-[1065px] brightness-90"
76-
>
77-
<Suspense fallback={<Skeleton />}>
78-
<div className="relative">
79-
<img
80-
className="rounded-3xl"
81-
alt="niko"
82-
src={PUBLIC_BLOG_IMAGES_SOURCE + 'winston-wolf.png'}
83-
/>
84-
<div className="absolute bottom-4 left-4 text-white opacity-40 font-bold text-sm">
85-
Pulp Fiction (1994) by Quentin Tarantino
86-
</div>
87-
</div>
88-
</Suspense>
89-
</motion.div>
90-
<div className="flex flex-col items-center justify-center my-7 md:mt-20">
91-
<motion.h2
92-
viewport={{ once: true }} // only run once per load
93-
whileInView={{
94-
opacity: 1,
95-
scale: 1,
96-
}}
97-
initial={{
98-
opacity: 0,
99-
scale: 0.7,
100-
}}
101-
transition={{
102-
duration: 0.2,
103-
ease: 'easeInOut',
104-
}}
105-
className="text-center italic text-2xl md:text-3xl font-bold dimmed-4"
106-
>
107-
- &quot;Hi, I&apos;m Winston Wolf, I solve problems&quot;
108-
</motion.h2>
109-
</div>
11060
<div className="flex flex-col items-center justify-center gap-6 mt-8 md:mt-20">
61+
<MajorHeading title="Hello" />
11162
<Card title="">
11263
<p>
11364
I&apos;m a software developer and technical educator, and I do work
114-
for hire. <br />
65+
for <Link href="/contact" name="hire." /> <br />
11566
Over the past 7 years I&apos;ve had the privilge to collaborate with
11667
numerous individuals, teams and startups worldwide, to build, scale,
11768
and lead software projects.
@@ -124,16 +75,18 @@ export default function Page() {
12475
<Link href="/blog/tag/quality" name="quality" /> code,
12576
<Link href="/blog/tag/skill-issues" name="high-performing" />
12677
teams, and effective
127-
<Link href="/blog/tag/management" name="management" />. And my
128-
services are aimed at enhancing these aspects for my clients.
78+
<Link href="/blog/tag/management" name="management." />
79+
<br /> And I do offer services aimed at enhancing these aspects for
80+
software teams.
12981
</p>
13082
</Card>
131-
<MajorHeading title="Stack" />
83+
<MajorHeading id="stack" title="Stack" />
13284
<Card title="">
13385
<p>
13486
While I have experience with many technologies, I specialize and
135-
work mostly in Python and TypeScript, with a heavy focus on
136-
everything web related (HTTP, RPC, GraphQL, microservices,
87+
work mostly in <Link href="/blog/tag/python" name="Python" /> and
88+
<Link href="/blog/tag/typescript" name="TypeScript" />, with a heavy
89+
focus on everything web related (HTTP, RPC, GraphQL, microservices,
13790
containers, cloud architecture...)
13891
</p>
13992
</Card>
@@ -152,23 +105,24 @@ export default function Page() {
152105
Frameworks and libraries don&apos;t matter they come and go.
153106
Fundamentals are key. But if you&apos;re interested in knowing the
154107
exact tools I use you can check out my
155-
<Link href="/blog/tag/management" name="cv" /> (it&apos;s too long),
156-
or, you might want to check out my
157-
<Link href="/blog/tag/management" name="resume" /> to get a glimpse
158-
instead.
108+
<Link href="#" name="cv" /> (it&apos;s too long), or, you might want
109+
to check out my
110+
<Link href="#" name="resume" /> to get a glimpse instead.
159111
</p>
160112
</Card>
161113
<MajorHeading title="About The Website" />
162114
<Card title="">
163115
<p>
164116
<code>{SITE_NAME}</code> is open{' '}
165-
<Link href="/blog/tag/management" name="source" /> and made with the
166-
following technologies and a sprinkle of creativity
117+
<Link href={REPO_SOURCE} name="source" />
118+
and made using the following technologies for provisioning,
119+
development, testing, and deployment, with a sprinkle of creativity
120+
and love.
167121
</p>
168122
</Card>
169123
<Card title="">
170124
<div className="flex flex-wrap justify-center items-center gap-[0.625rem] text-sm dimmed-4">
171-
{FrontEnd.map((tech) => (
125+
{ThisSiteTools.map((tech) => (
172126
<span
173127
key={tech}
174128
className="relative rounded-full px-2 py-1 border border-white/10"
@@ -193,6 +147,7 @@ interface BaseHeadingProps {
193147
const BaseHeading = (props: BaseHeadingProps) => {
194148
return (
195149
<motion.h2
150+
id={props.id}
196151
animate={{
197152
opacity: 1,
198153
x: 0,
@@ -211,17 +166,19 @@ const BaseHeading = (props: BaseHeadingProps) => {
211166
</motion.h2>
212167
);
213168
};
214-
const MinorHeading = ({ title }: { title: string }) => {
169+
170+
type HeadingProps = { title: string; id?: string };
171+
const MinorHeading = ({ title, id }: HeadingProps) => {
215172
return (
216-
<BaseHeading className="glows-dimmed dimmed-4 text-1xl font-bold">
173+
<BaseHeading id={id} className="glows-dimmed dimmed-4 text-1xl font-bold">
217174
{title}
218175
</BaseHeading>
219176
);
220177
};
221178

222-
const MajorHeading = ({ title }: { title: string }) => {
179+
const MajorHeading = ({ title, id }: HeadingProps) => {
223180
return (
224-
<BaseHeading className=" glows-dimmed dimmed-4 text-2xl font-bold">
181+
<BaseHeading id={id} className=" glows-dimmed dimmed-4 text-2xl font-bold">
225182
{title}
226183
</BaseHeading>
227184
);

‎src/app/(pages)/services/page.tsx‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -47,10 +47,12 @@ export default function Component() {
4747
className="dimmed-1 md:text-xl/relaxed lg:text-base/relaxed xl:text-xl/relaxed"
4848
>
4949
If you use my
50-
<GlowingText className="underline">stack</GlowingText>I got
51-
you. From architecting scalable APIs and designing beautiful
52-
user interfaces to quality code, I&apos;ve got the skills and
53-
experience to bring your ideas to life.
50+
<Link href="/about#stack">
51+
<GlowingText>stack</GlowingText>
52+
</Link>
53+
I got you. From architecting scalable APIs and designing
54+
beautiful user interfaces to quality code, I&apos;ve got the
55+
skills and experience to bring your ideas to life.
5456
</motion.p>
5557
</div>
5658
</div>

‎src/app/components/__futures__/pulp-fiction-ref.tsx‎

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
'use client';
2+
import { PUBLIC_BLOG_IMAGES_SOURCE } from '@/lib/constants';
3+
import { motion } from 'framer-motion';
4+
import { Skeleton } from '@/app/components/ui/skeleton';
5+
import React, { Suspense } from 'react';
6+
7+
const PulpFictionRef = () => {
8+
return (
9+
<>
10+
<motion.div
11+
animate={{
12+
opacity: 1,
13+
x: 0,
14+
}}
15+
initial={{
16+
opacity: 0,
17+
x: 20,
18+
}}
19+
transition={{
20+
duration: 0.2,
21+
ease: 'easeInOut',
22+
}}
23+
className="mx-auto w-full px-5 max-w-[1065px] brightness-90"
24+
>
25+
<Suspense fallback={<Skeleton />}>
26+
<div className="relative">
27+
<img
28+
className="rounded-3xl"
29+
alt="niko"
30+
src={PUBLIC_BLOG_IMAGES_SOURCE + 'winston-wolf.png'}
31+
/>
32+
<div className="absolute bottom-4 left-4 text-white opacity-40 font-bold text-sm">
33+
Pulp Fiction (1994) by Quentin Tarantino
34+
</div>
35+
</div>
36+
</Suspense>
37+
</motion.div>
38+
<div className="flex flex-col items-center justify-center my-7 md:mt-20">
39+
<motion.h2
40+
viewport={{ once: true }} // only run once per load
41+
whileInView={{
42+
opacity: 1,
43+
scale: 1,
44+
}}
45+
initial={{
46+
opacity: 0,
47+
scale: 0.7,
48+
}}
49+
transition={{
50+
duration: 0.2,
51+
ease: 'easeInOut',
52+
}}
53+
className="text-center italic text-2xl md:text-3xl font-bold dimmed-4"
54+
>
55+
- &quot;Hi, I&apos;m Winston Wolf, I solve problems&quot;
56+
</motion.h2>
57+
</div>
58+
</>
59+
);
60+
};
61+
62+
export default PulpFictionRef;

‎src/app/components/nav/nav.tsx‎

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import Image from 'next/image';
88
import HamburgerButton from '@/app/components/nav/hamburger';
99
import { motion, AnimatePresence } from 'framer-motion';
1010
import useToggleDropDownMenu from '@/lib/hooks/useToggleDropDownMenu';
11+
import { REPO_SOURCE } from '@/lib/constants';
1112

1213
export default function NavBar() {
1314
const [isOpened, toggleMenu] = useToggleDropDownMenu({
@@ -87,8 +88,8 @@ export function LeftNav() {
8788
export function RightNav() {
8889
return (
8990
<div className="absolute inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto sm:ml-6 sm:pr-0 gap-3">
90-
<div className="average-transition hover:average-translate">
91-
<SourceCodeButton href="https://github.com/ashgw/mysite" />
91+
<div className="hidden average-transition hover:average-translate">
92+
<SourceCodeButton href={REPO_SOURCE} />
9293
</div>
9394
<div className=" glowsup hidden sm:block">
9495
<Link href="/contact">
@@ -119,6 +120,14 @@ export function DropDownNav() {
119120
}}
120121
className="absolute rounded-3xl z-50 backdrop-blur-md w-full space-y-3 px-5 pb-3 pt-2"
121122
>
123+
<div className="average-transition hover:average-translate rounded-3xl slower-transition shadow hover:shadow-[0px_4px_88px_0px_var(--deeper-purple)] border border-white/10">
124+
<Link
125+
href="/"
126+
className="dimmed-3 px-5 py-2 hover:text-white block rounded-4xl border-green-400 text-base "
127+
>
128+
Home
129+
</Link>
130+
</div>
122131
<div className="average-transition hover:average-translate rounded-3xl slower-transition shadow hover:shadow-[0px_4px_88px_0px_var(--deeper-purple)] border border-white/10">
123132
<Link
124133
href="/services"

‎src/lib/constants.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,3 +21,4 @@ export const PUBLIC_BLOG_IMAGES_SOURCE =
2121
'https://ashgw-blog-public-images.s3.us-east-2.amazonaws.com/';
2222

2323
export const SITE_NAME = getSiteName(pub.SITE_URL_PROD);
24+
export const REPO_SOURCE = 'https://github.com/ashgw/ashgw.me';

0 commit comments

Comments
 (0)