mirror of
https://github.com/liyunze-coding/RythonDev.git
synced 2026-09-22 15:53:57 +00:00
updated skills, Backend
This commit is contained in:
liyunze
parent
4e82e18472
commit
ef3f88ff23
1 changed files with 138 additions and 39 deletions
|
|
@ -10,15 +10,15 @@ import Line from "../elements/NetworkLine.astro";
|
||||||
<Card primaryColor="#19a7ce">
|
<Card primaryColor="#19a7ce">
|
||||||
<div class="card-content">
|
<div class="card-content">
|
||||||
<div class="flex flex-col justify-left w-full">
|
<div class="flex flex-col justify-left w-full">
|
||||||
<h2 class="font-bold text-2xl">Web Development</h2>
|
<h2 class="font-bold text-2xl">Frontend Development</h2>
|
||||||
</div>
|
</div>
|
||||||
<hr class="w-full" />
|
<hr class="w-full" />
|
||||||
<p class="text-left lg:text-justify">
|
<p class="text-left lg:text-justify">
|
||||||
I started my web development journey by building
|
I started my web development journey by building
|
||||||
websites and widgets using vanilla HTML, CSS, Javascript
|
websites and widgets using vanilla HTML, CSS, Javascript
|
||||||
and Express. As I learnt more about the fundamentals of
|
and Express. As I learnt more about the fundamentals of
|
||||||
web development, I delved into frameworks such as
|
web development, I delved into frontend frameworks such
|
||||||
Svelte, React and Astro.
|
as Svelte, React and Astro.
|
||||||
</p>
|
</p>
|
||||||
<div class="w-full flex flex-row flex-wrap justify-start">
|
<div class="w-full flex flex-row flex-wrap justify-start">
|
||||||
<div
|
<div
|
||||||
|
|
@ -54,39 +54,7 @@ import Line from "../elements/NetworkLine.astro";
|
||||||
TypeScript
|
TypeScript
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="w-fit text-white bg-gray-500 hover:bg-[#617CBE]
|
class="w-fit text-white bg-gray-500 hover:bg-[#FF3E00]
|
||||||
rounded-full px-3 py-1 mr-1 my-1
|
|
||||||
cursor-default
|
|
||||||
transition-colors duration-300"
|
|
||||||
>
|
|
||||||
PHP
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="w-fit text-white bg-gray-500 hover:bg-[#00ADD8] hover:text-black
|
|
||||||
rounded-full px-3 py-1 mr-1 my-1
|
|
||||||
cursor-default
|
|
||||||
transition-colors duration-300"
|
|
||||||
>
|
|
||||||
Go
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="w-fit text-white bg-gray-500 hover:bg-black
|
|
||||||
rounded-full px-3 py-1 mr-1 my-1
|
|
||||||
cursor-default
|
|
||||||
transition-colors duration-300"
|
|
||||||
>
|
|
||||||
Rust
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="w-fit text-white bg-gray-500 hover:bg-yellow-500 hover:text-black
|
|
||||||
rounded-full px-3 py-1 mr-1 my-1
|
|
||||||
cursor-default
|
|
||||||
transition-colors duration-300"
|
|
||||||
>
|
|
||||||
Express
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="w-fit text-white bg-gray-500 hover:bg-orange-500
|
|
||||||
rounded-full px-3 py-1 mr-1 my-1
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
cursor-default
|
cursor-default
|
||||||
transition-colors duration-300"
|
transition-colors duration-300"
|
||||||
|
|
@ -134,7 +102,7 @@ import Line from "../elements/NetworkLine.astro";
|
||||||
TailwindCSS
|
TailwindCSS
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="w-fit text-white bg-gray-500 hover:bg-[#8500C7]
|
class="w-fit text-white bg-gray-500 hover:bg-[#646CFF]
|
||||||
rounded-full px-3 py-1 mr-1 my-1
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
cursor-default
|
cursor-default
|
||||||
transition-colors duration-300"
|
transition-colors duration-300"
|
||||||
|
|
@ -145,6 +113,137 @@ import Line from "../elements/NetworkLine.astro";
|
||||||
</div>
|
</div>
|
||||||
</Card>
|
</Card>
|
||||||
<Line height="50px" />
|
<Line height="50px" />
|
||||||
|
<Card primaryColor="#474F7A">
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="flex flex-col justify-left w-full">
|
||||||
|
<h2 class="font-bold text-2xl">Backend Development</h2>
|
||||||
|
</div>
|
||||||
|
<hr class="w-full" />
|
||||||
|
<p class="text-left lg:text-justify">
|
||||||
|
In the beginning, I used my Python skills to entertain
|
||||||
|
and to automate the boring stuff, such as using Selenium
|
||||||
|
for automation + web scraping, play chess by automating
|
||||||
|
mouse controls and build Discord bots. Now, I am
|
||||||
|
experienced with backend web development, managing
|
||||||
|
databases and building performant applications.
|
||||||
|
</p>
|
||||||
|
<div class="w-full flex flex-row flex-wrap justify-start">
|
||||||
|
<div
|
||||||
|
class="w-fit text-white bg-gray-500 hover:bg-[#3776AB]
|
||||||
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
|
cursor-default
|
||||||
|
transition-colors duration-300"
|
||||||
|
>
|
||||||
|
Python
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="w-fit text-white bg-gray-500 hover:bg-yellow-400 hover:text-black
|
||||||
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
|
cursor-default
|
||||||
|
transition-colors duration-300"
|
||||||
|
>
|
||||||
|
Javascript
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="w-fit text-white bg-gray-500 hover:bg-blue-400 hover:text-black
|
||||||
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
|
cursor-default
|
||||||
|
transition-colors duration-300"
|
||||||
|
>
|
||||||
|
TypeScript
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="w-fit text-white bg-gray-500 hover:bg-[#617CBE]
|
||||||
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
|
cursor-default
|
||||||
|
transition-colors duration-300"
|
||||||
|
>
|
||||||
|
PHP
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="w-fit text-white bg-gray-500 hover:bg-[#00ADD8]
|
||||||
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
|
cursor-default
|
||||||
|
transition-colors duration-300"
|
||||||
|
>
|
||||||
|
Go
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="w-fit text-white bg-gray-500 hover:bg-black
|
||||||
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
|
cursor-default
|
||||||
|
transition-colors duration-300"
|
||||||
|
>
|
||||||
|
Rust
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="w-fit text-white bg-gray-500 hover:bg-[#4479A1]
|
||||||
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
|
cursor-default
|
||||||
|
transition-colors duration-300"
|
||||||
|
>
|
||||||
|
MySQL
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="w-fit text-white bg-gray-500 hover:bg-yellow-500 hover:text-black
|
||||||
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
|
cursor-default
|
||||||
|
transition-colors duration-300"
|
||||||
|
>
|
||||||
|
Express
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="w-fit text-white bg-gray-500 hover:bg-[#339933]
|
||||||
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
|
cursor-default
|
||||||
|
transition-colors duration-300"
|
||||||
|
>
|
||||||
|
Node.js
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="w-fit text-white bg-gray-500 hover:bg-[#FBEFDF] hover:text-black
|
||||||
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
|
cursor-default
|
||||||
|
transition-colors duration-300"
|
||||||
|
>
|
||||||
|
Bun
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="w-fit text-white bg-gray-500 hover:bg-[#FF3E00]
|
||||||
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
|
cursor-default
|
||||||
|
transition-colors duration-300"
|
||||||
|
>
|
||||||
|
Sveltekit
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="w-fit text-white bg-gray-500 hover:bg-black
|
||||||
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
|
cursor-default
|
||||||
|
transition-colors duration-300"
|
||||||
|
>
|
||||||
|
Next.js
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="w-fit text-white bg-gray-500 hover:bg-[#21759B]
|
||||||
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
|
cursor-default
|
||||||
|
transition-colors duration-300"
|
||||||
|
>
|
||||||
|
WordPress
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="w-fit text-white bg-gray-500 hover:bg-[#24C8D8] hover:text-black
|
||||||
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
|
cursor-default
|
||||||
|
transition-colors duration-300"
|
||||||
|
>
|
||||||
|
Tauri
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Card>
|
||||||
|
<Line height="50px" />
|
||||||
<Card primaryColor="#a1eebd">
|
<Card primaryColor="#a1eebd">
|
||||||
<div class="card-content">
|
<div class="card-content">
|
||||||
<div class="flex flex-col justify-left w-full">
|
<div class="flex flex-col justify-left w-full">
|
||||||
|
|
@ -162,7 +261,7 @@ import Line from "../elements/NetworkLine.astro";
|
||||||
</p>
|
</p>
|
||||||
<div class="w-full flex flex-row flex-wrap justify-start">
|
<div class="w-full flex flex-row flex-wrap justify-start">
|
||||||
<div
|
<div
|
||||||
class="w-fit text-white bg-gray-500 hover:text-white hover:bg-blue-700
|
class="w-fit text-white bg-gray-500 hover:bg-[#3776AB]
|
||||||
rounded-full px-3 py-1 mr-1 my-1
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
cursor-default
|
cursor-default
|
||||||
transition-colors duration-300"
|
transition-colors duration-300"
|
||||||
|
|
@ -194,7 +293,7 @@ import Line from "../elements/NetworkLine.astro";
|
||||||
SAS
|
SAS
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="w-fit text-white bg-gray-500 hover:bg-orange-700
|
class="w-fit text-white bg-gray-500 hover:bg-[#4479A1]
|
||||||
rounded-full px-3 py-1 mr-1 my-1
|
rounded-full px-3 py-1 mr-1 my-1
|
||||||
cursor-default
|
cursor-default
|
||||||
transition-colors duration-300"
|
transition-colors duration-300"
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue