mirror of
https://github.com/liyunze-coding/RythonDev.git
synced 2026-09-22 07:44:26 +00:00
updated socials, added faq
This commit is contained in:
liyunze
parent
0b13b82462
commit
6f05d793bd
6 changed files with 287 additions and 205 deletions
|
|
@ -14,23 +14,29 @@ import Line from "../elements/NetworkLine.astro";
|
|||
Frontend Web Developer Intern
|
||||
</h2>
|
||||
<h3 class="font-bold">@ Studio20 Malaysia</h3>
|
||||
<h3>Jan - April 2024</h3>
|
||||
<h3>Jan 2024 - April 2024</h3>
|
||||
</div>
|
||||
<hr class="w-full mb-3" />
|
||||
<p class="mb-3">
|
||||
During my internship, I learnt how to do WordPress and
|
||||
further enhanced my skills in PHP. I also learnt how to
|
||||
closely work with UI/UX designers and pay close
|
||||
attention to details with the design I am given.
|
||||
During my internship, I learnt how to build WordPress
|
||||
sites and further enhance my skills in PHP. I also
|
||||
learnt how to closely work with UI/UX designers and pay
|
||||
close attention to details with the designs I am given.
|
||||
</p>
|
||||
<h3 class="mb-1 font-bold text-lg">Relevant skills:</h3>
|
||||
<ul class="list-disc list-inside">
|
||||
<li>WordPress & PHP</li>
|
||||
<li>NextJS</li>
|
||||
<li>Typescript</li>
|
||||
<li>TailwindCSS</li>
|
||||
<li>Adobe XD</li>
|
||||
</ul>
|
||||
<div
|
||||
class="flex flex-col md:flex-row justify-start items-start gap-0 md:gap-10"
|
||||
>
|
||||
<ul class="list-disc list-inside">
|
||||
<li>WordPress & PHP</li>
|
||||
<li>Typescript</li>
|
||||
<li>TailwindCSS</li>
|
||||
</ul>
|
||||
<ul class="list-disc list-inside">
|
||||
<li>Adobe XD</li>
|
||||
<li>NextJS & React</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
<Line height="50px" />
|
||||
|
|
@ -38,8 +44,8 @@ import Line from "../elements/NetworkLine.astro";
|
|||
<div class="card-content md:px-8 md:py-8 px-4 py-4">
|
||||
<div class="flex flex-col justify-start w-full mb-3 gap-1">
|
||||
<h2 class="font-bold text-xl">
|
||||
Diploma in Computer Science
|
||||
</h2><h3>Jan 2022 - 2024</h3>
|
||||
Diploma in Computer Science student
|
||||
</h2><h3>Jan 2022 - June 2024</h3>
|
||||
</div>
|
||||
<hr class="w-full mb-3" />
|
||||
<h3 class="mb-1 font-bold text-lg">Achievements</h3>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import Layout from "../layouts/Layout.astro";
|
|||
---
|
||||
|
||||
<Layout title="Discord" description="Join Ryan's Discord server!">
|
||||
<script is:inline>
|
||||
window.location.href = " https://discord.gg/UnHyHkhbga";
|
||||
</script>
|
||||
<script is:inline>
|
||||
window.location.href = " https://discord.gg/UnHyHkhbga";
|
||||
</script>
|
||||
</Layout>
|
||||
|
|
|
|||
76
src/pages/faq.astro
Normal file
76
src/pages/faq.astro
Normal file
|
|
@ -0,0 +1,76 @@
|
|||
---
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
import Card from "../components/elements/Card.astro";
|
||||
---
|
||||
|
||||
<Layout title="Socials" description="Check out Ryan's socials">
|
||||
<div class="mx-auto my-10 max-w-full w-[90%] md:w-1/2">
|
||||
<Card primaryColor="aquamarine">
|
||||
<div class="card-content md:px-8 md:py-8 px-4 py-4">
|
||||
<h1 class="font-bold text-3xl text-center">
|
||||
Frequently Asked Questions
|
||||
</h1>
|
||||
<hr class="my-2" />
|
||||
<!-- Who are you? -->
|
||||
<h2 class="font-bold text-xl">Who are you?</h2>
|
||||
<p>
|
||||
I'm Ryan, I am a software developer and a coworking & study
|
||||
streamer.
|
||||
<br /> <br/>
|
||||
See my website <a
|
||||
target="_blank"
|
||||
href="https://rython.dev/"
|
||||
class="text-blue-400 underline">here</a
|
||||
> to learn more about me, including my software development portfolio and my content creation projects.
|
||||
</p>
|
||||
<hr class="my-2" />
|
||||
<h2 class="font-bold text-xl">Where are you from? What languages do you speak?</h2>
|
||||
<p>
|
||||
I'm born and raised in Malaysia, studying in Australia. I speak English, Mandarin Chinese, and some Malay. I can read both traditional and simplified Chinese characters.
|
||||
</p>
|
||||
<hr class="my-2" />
|
||||
<!-- How to pronounce? -->
|
||||
<h2 class="font-bold text-xl">How to pronounce your username?</h2>
|
||||
<p>
|
||||
Try to pronounce Python, and then replace the "Py" with "Ry". You can also call me "Ry" or "Ryan" if you prefer.
|
||||
</p>
|
||||
<hr class="my-2" />
|
||||
<!-- What is a coworking stream? -->
|
||||
<h2 class="font-bold text-xl">What is a coworking stream?</h2>
|
||||
<p>
|
||||
That question is answered <a target="_blank"
|
||||
class="text-blue-400 underline"
|
||||
href="https://coworking-guide.vercel.app/get-started/introduction#what-are-coworking-streams">here</a>.
|
||||
</p>
|
||||
<hr class="my-2" />
|
||||
<!-- What is a coworking stream? -->
|
||||
<h2 class="font-bold text-xl">Why are you muted? Why aren't you reading chat?</h2>
|
||||
<p>
|
||||
During work time, I am muted and not reading chat to focus on my work. I will try to catch up on chat during break time.
|
||||
</p>
|
||||
<hr class="my-2" />
|
||||
<!-- What is a coworking stream? -->
|
||||
<h2 class="font-bold text-xl">Is that a keychron?</h2>
|
||||
<p>
|
||||
No. It's an Epomaker GK64x modded with black switches.
|
||||
</p>
|
||||
<hr class="my-2" />
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
<style>
|
||||
.card-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
background-image: radial-gradient(
|
||||
rgba(255, 255, 255, 0.1) 1px,
|
||||
transparent 1px
|
||||
);
|
||||
background-position: 50% 50%;
|
||||
background-size: 1.1rem 1.1rem;
|
||||
border-radius: 1.25rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
</Layout>
|
||||
|
|
@ -5,8 +5,8 @@ import ProjectsComponent from "../components/sections/ProjectsComponent.svelte";
|
|||
---
|
||||
|
||||
<Layout title="Projects" description="View what projects RythonDev has made">
|
||||
<NavBar />
|
||||
<div id="what-i-do" class="mt-10 pb-20">
|
||||
<ProjectsComponent />
|
||||
</div>
|
||||
<NavBar />
|
||||
<div id="what-i-do" class="mt-10 pb-20">
|
||||
<ProjectsComponent />
|
||||
</div>
|
||||
</Layout>
|
||||
|
|
|
|||
|
|
@ -452,7 +452,7 @@ import Layout from "../layouts/Layout.astro";
|
|||
</svg>
|
||||
<div>
|
||||
<h2 class="font-bold text-xl">Location</h2>
|
||||
<p class="text-[#ccc]">Asia, Malaysia</p>
|
||||
<p class="text-[#ccc]">Melbourne, Australia</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
|
|
@ -845,7 +845,7 @@ import Layout from "../layouts/Layout.astro";
|
|||
}
|
||||
</style>
|
||||
<script is:inline>
|
||||
const MY_TIMEZONE = "Asia/Kuala_Lumpur";
|
||||
const MY_TIMEZONE = "Australia/Melbourne";
|
||||
document.getElementById("cards").onmousemove = (e) => {
|
||||
for (const card of document.getElementsByClassName("social-card")) {
|
||||
const rect = card.getBoundingClientRect(),
|
||||
|
|
@ -930,7 +930,7 @@ import Layout from "../layouts/Layout.astro";
|
|||
|
||||
setInterval(() => {
|
||||
time = new Date().toLocaleTimeString("en-UK", {
|
||||
timeZone: "Asia/Kuala_Lumpur",
|
||||
timeZone: MY_TIMEZONE,
|
||||
hour: "numeric",
|
||||
minute: "numeric",
|
||||
hour12: true,
|
||||
|
|
|
|||
|
|
@ -7,202 +7,202 @@ import Line from "../components/elements/NetworkLine.astro";
|
|||
---
|
||||
|
||||
<Layout
|
||||
title="What I Do"
|
||||
description="What Ryan's skillsets are, in Data Science, Web Development and Content Creation"
|
||||
title="What I Do"
|
||||
description="What Ryan's skillsets are, in Data Science, Web Development and Content Creation"
|
||||
>
|
||||
<NavBar />
|
||||
<div id="what-i-do" class="mt-10 pt-20 pb-20">
|
||||
<WhatIDoComponent />
|
||||
<NavBar />
|
||||
<div id="what-i-do" class="mt-10 pt-20 pb-20">
|
||||
<WhatIDoComponent />
|
||||
|
||||
<div class="mx-auto w-[90%] md:w-[750px] mt-20">
|
||||
<Card primaryColor="#19a7ce">
|
||||
<div class="card-content">
|
||||
<h2
|
||||
id="web-dev"
|
||||
class="font-bold text-2xl animate-gradient"
|
||||
>
|
||||
Web Development
|
||||
</h2>
|
||||
<hr class="w-full mb-3 mt-3" />
|
||||
<div class="mb-5">
|
||||
<h3 class="font-bold text-xl">Websites</h3>
|
||||
<p class="mt-1 text-left">
|
||||
I go beyond coding; I'm a developer who translates
|
||||
your vision into a captivating online presence.
|
||||
Through custom designs, intuitive user experiences,
|
||||
and special attention to detail, I weave your unique
|
||||
narrative into every strand of your website.
|
||||
</p>
|
||||
</div>
|
||||
<div class="mb-5">
|
||||
<h3 class="font-bold text-xl">Web Apps</h3>
|
||||
<p class="mt-1 text-left">
|
||||
I craft solutions that streamline workflows, boost
|
||||
efficiency, and empower your users to achieve more.
|
||||
With a focus on intuitive interfaces, powerful
|
||||
functionality, and data-driven optimization, I
|
||||
transform complex ideas into elegant tools that
|
||||
seamlessly integrate into your ecosystem.
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="font-bold text-xl">Widgets</h3>
|
||||
<p class="mt-1 text-left">
|
||||
Leveraging my web development skills, I built stream
|
||||
widgets to level up the stream! Easy to use and
|
||||
customize, my work have been used by 100+ streamers
|
||||
from pomodoro timers to to-do lists!
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
<Line height="50px" />
|
||||
<Card primaryColor="#a1eebd">
|
||||
<div class="card-content">
|
||||
<h2
|
||||
id="data-science"
|
||||
class="font-bold text-2xl animate-gradient"
|
||||
>
|
||||
Data Science
|
||||
</h2>
|
||||
<hr class="w-full mb-3 mt-3" />
|
||||
<div class="mb-5">
|
||||
<h3 class="font-bold text-xl">
|
||||
Data Analysis and Visualization
|
||||
</h3>
|
||||
<p class="mt-1 text-left">
|
||||
I'm your data artist, translating numbers into works
|
||||
of art that inform, inspire, and guide
|
||||
decision-making. We'll create visually compelling
|
||||
narratives that turn dry statistics into captivating
|
||||
stories using Python and R.
|
||||
</p>
|
||||
</div>
|
||||
<div class="mb-5">
|
||||
<h3 class="font-bold text-xl">
|
||||
Statistics and Probability
|
||||
</h3>
|
||||
<p class="mt-1 text-left">
|
||||
Every number tells a story, but it takes the
|
||||
language of statistics and probability to truly
|
||||
understand it. Our world is awash in data, but it's
|
||||
only through these powerful tools that we can
|
||||
transform it into meaningful insights and actionable
|
||||
intelligence.
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="font-bold text-xl">Machine Learning</h3>
|
||||
<p class="mt-1 text-left">
|
||||
Machine learning isn't just about mimicking human
|
||||
intelligence, it's about surpassing it. We push the
|
||||
boundaries of what's possible, collaborating with
|
||||
code to solve problems beyond human capabilities.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
<Line height="50px" />
|
||||
<Card primaryColor="#9D76C1">
|
||||
<div class="card-content">
|
||||
<h2
|
||||
id="content-creation"
|
||||
class="font-bold text-2xl animate-gradient"
|
||||
>
|
||||
Content Creation
|
||||
</h2>
|
||||
<hr class="w-full mb-3 mt-3" />
|
||||
<div class="mb-5">
|
||||
<h3 class="font-bold text-xl">Streaming</h3>
|
||||
<p class="mt-1 text-left">
|
||||
Streaming isn't just about entertainment, it's about
|
||||
building a brand that resonates and inspires.
|
||||
Streaming allows me to enhance my marketing skills
|
||||
and the ability to entertain and engage with viewers
|
||||
in real time.
|
||||
</p>
|
||||
</div>
|
||||
<div class="mb-5">
|
||||
<h3 class="font-bold text-xl">Video Editing</h3>
|
||||
<p class="mt-1 text-left">
|
||||
I may be at the beginning of my video editing
|
||||
adventure, but I'm committed to making your vision a
|
||||
reality. I'll learn, adapt, and work tirelessly to
|
||||
translate your ideas into compelling videos that
|
||||
resonate with your audience.
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="font-bold text-xl">Personality</h3>
|
||||
<p class="mt-1 text-left">
|
||||
I believe content should be an adventure, not a
|
||||
formula. my world is a vibrant playground of
|
||||
unscripted interactions, quirky challenges, and raw
|
||||
emotional moments. It's messy, it's exhilarating,
|
||||
and it's uniquely me.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto w-[90%] md:w-[750px] mt-20">
|
||||
<Card primaryColor="#19a7ce">
|
||||
<div class="card-content">
|
||||
<h2
|
||||
id="web-dev"
|
||||
class="font-bold text-2xl animate-gradient"
|
||||
>
|
||||
Web Development
|
||||
</h2>
|
||||
<hr class="w-full mb-3 mt-3" />
|
||||
<div class="mb-5">
|
||||
<h3 class="font-bold text-xl">Websites</h3>
|
||||
<p class="mt-1 text-left">
|
||||
I go beyond coding; I'm a developer who translates
|
||||
your vision into a captivating online presence.
|
||||
Through custom designs, intuitive user experiences,
|
||||
and special attention to detail, I weave your unique
|
||||
narrative into every strand of your website.
|
||||
</p>
|
||||
</div>
|
||||
<div class="mb-5">
|
||||
<h3 class="font-bold text-xl">Web Apps</h3>
|
||||
<p class="mt-1 text-left">
|
||||
I craft solutions that streamline workflows, boost
|
||||
efficiency, and empower your users to achieve more.
|
||||
With a focus on intuitive interfaces, powerful
|
||||
functionality, and data-driven optimization, I
|
||||
transform complex ideas into elegant tools that
|
||||
seamlessly integrate into your ecosystem.
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="font-bold text-xl">Widgets</h3>
|
||||
<p class="mt-1 text-left">
|
||||
Leveraging my web development skills, I built stream
|
||||
widgets to level up the stream! Easy to use and
|
||||
customize, my work have been used by 100+ streamers
|
||||
from pomodoro timers to to-do lists!
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
<Line height="50px" />
|
||||
<Card primaryColor="#a1eebd">
|
||||
<div class="card-content">
|
||||
<h2
|
||||
id="data-science"
|
||||
class="font-bold text-2xl animate-gradient"
|
||||
>
|
||||
Data Science
|
||||
</h2>
|
||||
<hr class="w-full mb-3 mt-3" />
|
||||
<div class="mb-5">
|
||||
<h3 class="font-bold text-xl">
|
||||
Data Analysis and Visualization
|
||||
</h3>
|
||||
<p class="mt-1 text-left">
|
||||
I'm your data artist, translating numbers into works
|
||||
of art that inform, inspire, and guide
|
||||
decision-making. We'll create visually compelling
|
||||
narratives that turn dry statistics into captivating
|
||||
stories using Python and R.
|
||||
</p>
|
||||
</div>
|
||||
<div class="mb-5">
|
||||
<h3 class="font-bold text-xl">
|
||||
Statistics and Probability
|
||||
</h3>
|
||||
<p class="mt-1 text-left">
|
||||
Every number tells a story, but it takes the
|
||||
language of statistics and probability to truly
|
||||
understand it. Our world is awash in data, but it's
|
||||
only through these powerful tools that we can
|
||||
transform it into meaningful insights and actionable
|
||||
intelligence.
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="font-bold text-xl">Machine Learning</h3>
|
||||
<p class="mt-1 text-left">
|
||||
Machine learning isn't just about mimicking human
|
||||
intelligence, it's about surpassing it. We push the
|
||||
boundaries of what's possible, collaborating with
|
||||
code to solve problems beyond human capabilities.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
<Line height="50px" />
|
||||
<Card primaryColor="#9D76C1">
|
||||
<div class="card-content">
|
||||
<h2
|
||||
id="content-creation"
|
||||
class="font-bold text-2xl animate-gradient"
|
||||
>
|
||||
Content Creation
|
||||
</h2>
|
||||
<hr class="w-full mb-3 mt-3" />
|
||||
<div class="mb-5">
|
||||
<h3 class="font-bold text-xl">Streaming</h3>
|
||||
<p class="mt-1 text-left">
|
||||
Streaming isn't just about entertainment, it's about
|
||||
building a brand that resonates and inspires.
|
||||
Streaming allows me to enhance my marketing skills
|
||||
and the ability to entertain and engage with viewers
|
||||
in real time.
|
||||
</p>
|
||||
</div>
|
||||
<div class="mb-5">
|
||||
<h3 class="font-bold text-xl">Video Editing</h3>
|
||||
<p class="mt-1 text-left">
|
||||
I may be at the beginning of my video editing
|
||||
adventure, but I'm committed to making your vision a
|
||||
reality. I'll learn, adapt, and work tirelessly to
|
||||
translate your ideas into compelling videos that
|
||||
resonate with your audience.
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="font-bold text-xl">Personality</h3>
|
||||
<p class="mt-1 text-left">
|
||||
I believe content should be an adventure, not a
|
||||
formula. my world is a vibrant playground of
|
||||
unscripted interactions, quirky challenges, and raw
|
||||
emotional moments. It's messy, it's exhilarating,
|
||||
and it's uniquely me.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
|
||||
<style>
|
||||
.card-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-image: radial-gradient(
|
||||
rgba(255, 255, 255, 0.1) 1px,
|
||||
transparent 1px
|
||||
);
|
||||
background-position: 50% 50%;
|
||||
background-size: 1.1rem 1.1rem;
|
||||
padding: 2rem 2rem;
|
||||
border-radius: 1.25rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
.card-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-image: radial-gradient(
|
||||
rgba(255, 255, 255, 0.1) 1px,
|
||||
transparent 1px
|
||||
);
|
||||
background-position: 50% 50%;
|
||||
background-size: 1.1rem 1.1rem;
|
||||
border-radius: 1.25rem;
|
||||
padding: 2rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#web-dev {
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
#afd3e2 0%,
|
||||
#19a7ce 45%,
|
||||
#a5d7e8 100%
|
||||
);
|
||||
#web-dev {
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
#afd3e2 0%,
|
||||
#19a7ce 45%,
|
||||
#a5d7e8 100%
|
||||
);
|
||||
|
||||
background-size: 300%;
|
||||
background-size: 300%;
|
||||
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
|
||||
#data-science {
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
#a1eebd 0%,
|
||||
#7bd3ea 45%,
|
||||
#f6f7c4 100%
|
||||
);
|
||||
#data-science {
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
#a1eebd 0%,
|
||||
#7bd3ea 45%,
|
||||
#f6f7c4 100%
|
||||
);
|
||||
|
||||
background-size: 300%;
|
||||
background-size: 300%;
|
||||
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
|
||||
#content-creation {
|
||||
background: linear-gradient(90deg, #9d76c1 40%, #ff6868 90%);
|
||||
#content-creation {
|
||||
background: linear-gradient(90deg, #9d76c1 40%, #ff6868 90%);
|
||||
|
||||
background-size: 300%;
|
||||
background-size: 300%;
|
||||
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in a new issue