added stuff

This commit is contained in:
WinsDominoes 2023-12-21 20:40:11 +07:00
parent 851fa25b53
commit cfed25116b
31 changed files with 148 additions and 40 deletions

View File

@ -4,13 +4,13 @@ import Link from 'next/link';
import React from "react"; import React from "react";
const Photo = ({src, href, alt, dim}: any) => { const Photo = ({src, href, alt, dim}: any) => {
let classes; let classes = "transition ease-in-out delay-150 hover:scale-105 duration-300";
if(!dim || dim == "true") { /** if(!dim || dim == "true") {
classes = "transition ease-in-out delay-150 opacity-75 hover:opacity-100 hover:scale-105 duration-300" classes = "transition ease-in-out delay-150 opacity-75 hover:opacity-100 hover:scale-105 duration-300"
} else if (dim == "false") { } else if (dim == "false") {
classes = "transition ease-in-out delay-150 hover:scale-105 duration-300" classes = "transition ease-in-out delay-150 hover:scale-105 duration-300"
} } **/
if(!href || href == "#") { if(!href || href == "#") {
return ( return (

View File

@ -34,18 +34,18 @@ export default function Hobbies() {
<div className="grid grid-cols-2 md:grid-cols-4 gap-6"> <div className="grid grid-cols-2 md:grid-cols-4 gap-6">
<div className="grid col-span-3 gap-2 content-center"> <div className="grid col-span-3 gap-2 content-center">
<div> <div>
<Photo src="/images/photos/cosplay/tasm-2-main.jpg" href="https://www.instagram.com/p/CqvbNxnyCXl" alt="The Amazing Spider-Man 2" dim="false"></Photo> <Photo src="/images/photos/cosplay/tasm-2-main.jpg" href="https://www.instagram.com/p/CqvbNxnyCXl" alt="The Amazing Spider-Man 2" ></Photo>
</div> </div>
</div> </div>
<div className="grid gap-2 content-center max-md:hidden"> <div className="grid gap-2 content-center max-md:hidden">
<div> <div>
<Photo src="/images/photos/cosplay/win&art.jpg" href="https://www.instagram.com/p/CzkonahrURS/?img_index=3" alt="Spider-Men" dim="false"></Photo> <Photo src="/images/photos/cosplay/win&art.jpg" href="https://www.instagram.com/p/CzkonahrURS/?img_index=3" alt="Spider-Men" ></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/cosplay/win-and-art-thinking.jpg" href="https://www.instagram.com/p/CzkonahrURS/?img_index=2" alt="Thinking" dim="false"></Photo> <Photo src="/images/photos/cosplay/win-and-art-thinking.jpg" href="https://www.instagram.com/p/CzkonahrURS/?img_index=2" alt="Thinking" ></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/cosplay/win-and-art-4.jpg" href="https://www.instagram.com/p/CzkonahrURS/?img_index=1" alt="Spider-Bros" dim="false"></Photo> <Photo src="/images/photos/cosplay/win-and-art-4.jpg" href="https://www.instagram.com/p/CzkonahrURS/?img_index=1" alt="Spider-Bros" ></Photo>
</div> </div>
</div> </div>
</div> </div>
@ -57,32 +57,32 @@ export default function Hobbies() {
<div className="grid grid-cols-3 md:grid-cols-4 gap-6"> <div className="grid grid-cols-3 md:grid-cols-4 gap-6">
<div className="grid gap-4 content-center"> <div className="grid gap-4 content-center">
<div> <div>
<Photo src="/images/photos/cosplay/tasm-2-spider-man-2-2.jpg" href="https://www.instagram.com/p/CyiVaBoLBVR/?img_index=1" alt="TASM2 Pose" dim="false"></Photo> <Photo src="/images/photos/cosplay/tasm-2-spider-man-2-2.jpg" href="https://www.instagram.com/p/CyiVaBoLBVR/?img_index=1" alt="TASM2 Pose" ></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/cosplay/hulk-asiatique.jpg" href="https://www.instagram.com/p/CrTS2T9ScLs/?img_index=1" alt="TASM2 Pose" dim="false"></Photo> <Photo src="/images/photos/cosplay/hulk-asiatique.jpg" href="https://www.instagram.com/p/CrTS2T9ScLs/?img_index=1" alt="TASM2 Pose" ></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/cosplay/tasm-2-spider-man-2.jpg" href="https://www.instagram.com/p/CyiVaBoLBVR/?img_index=4" alt="Symbiote" dim="false"></Photo> <Photo src="/images/photos/cosplay/tasm-2-spider-man-2.jpg" href="https://www.instagram.com/p/CyiVaBoLBVR/?img_index=4" alt="Symbiote" ></Photo>
</div> </div>
</div> </div>
<div className="grid col-span-2 gap-4 content-center"> <div className="grid col-span-2 gap-4 content-center">
<div> <div>
<Photo src="/images/photos/cosplay/spiderverse.jpg" href="https://www.facebook.com/WinsDominoes/posts/pfbid02aE4Hocw54B8M3g5DcyPKEfRDRZ6Do4xKnbyCsHycrbgt7n5Te7SXvceWwkFbmnNMl" alt="Spider-Verse" dim="false"></Photo> <Photo src="/images/photos/cosplay/spiderverse.jpg" href="https://www.facebook.com/WinsDominoes/posts/pfbid02aE4Hocw54B8M3g5DcyPKEfRDRZ6Do4xKnbyCsHycrbgt7n5Te7SXvceWwkFbmnNMl" alt="Spider-Verse" ></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/cosplay/spiderverse-photo.jpg" href="https://www.facebook.com/WinsDominoes/posts/pfbid0ahuYTHefP9Mf8eXLeYkpi9iFKGxKpDqxKkUu7yKh78CjyfQSuofG4wsGG5QxuZ8ol" alt="Spider-Man: Into the Spider-Verse" dim="false"></Photo> <Photo src="/images/photos/cosplay/spiderverse-photo.jpg" href="https://www.facebook.com/WinsDominoes/posts/pfbid0ahuYTHefP9Mf8eXLeYkpi9iFKGxKpDqxKkUu7yKh78CjyfQSuofG4wsGG5QxuZ8ol" alt="Spider-Man: Into the Spider-Verse" ></Photo>
</div> </div>
</div> </div>
<div className="grid gap-4 content-center max-md:hidden"> <div className="grid gap-4 content-center max-md:hidden">
<div> <div>
<Photo src="/images/photos/cosplay/gtoqw.jpg" href="https://www.instagram.com/p/Cs7ZYrdSEaT/?img_index=1" alt="Across the Spider-Verse Fan Meet" dim="false"></Photo> <Photo src="/images/photos/cosplay/gtoqw.jpg" href="https://www.instagram.com/p/Cs7ZYrdSEaT/?img_index=1" alt="Across the Spider-Verse Fan Meet" ></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/cosplay/peter-b-main.jpg" href="https://www.facebook.com/photo.php?fbid=1485878428813697&set=pb.100021746621221.-2207520000&type=3" alt="Peter B. Parker" dim="false"></Photo> <Photo src="/images/photos/cosplay/peter-b-main.jpg" href="https://www.facebook.com/photo.php?fbid=1485878428813697&set=pb.100021746621221.-2207520000&type=3" alt="Peter B. Parker" ></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/cosplay/gtoqw2.jpg" href="https://www.facebook.com/photo.php?fbid=1433342307462095&set=t.100021746621221&type=3" alt="Guardians Of The Quantum World" dim="false"></Photo> <Photo src="/images/photos/cosplay/gtoqw2.jpg" href="https://www.facebook.com/photo.php?fbid=1433342307462095&set=t.100021746621221&type=3" alt="Guardians Of The Quantum World" ></Photo>
</div> </div>
</div> </div>
</div> </div>
@ -124,23 +124,23 @@ export default function Hobbies() {
<div className="grid grid-cols-3 gap-6"> <div className="grid grid-cols-3 gap-6">
<div className="grid gap-4 content-center"> <div className="grid gap-4 content-center">
<div> <div>
<Photo src="/images/photos/graphic-design/attaste/attaste-background-2.jpg" href="https://www.facebook.com/attaste.rmutt/posts/pfbid0Ba9jKJybSD8VV88kQd85SB3RWhRY5GTVh7bbes3begdK4FADxbaHvaYqqqEYsV8Yl" alt="" dim="false"></Photo> <Photo src="/images/photos/graphic-design/attaste/attaste-background-2.jpg" href="https://www.facebook.com/attaste.rmutt/posts/pfbid0Ba9jKJybSD8VV88kQd85SB3RWhRY5GTVh7bbes3begdK4FADxbaHvaYqqqEYsV8Yl" alt=""></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/graphic-design/attaste/attaste-background.jpg" href="https://www.facebook.com/attaste.rmutt/posts/pfbid0Ba9jKJybSD8VV88kQd85SB3RWhRY5GTVh7bbes3begdK4FADxbaHvaYqqqEYsV8Yl" alt="" dim="false"></Photo> <Photo src="/images/photos/graphic-design/attaste/attaste-background.jpg" href="https://www.facebook.com/attaste.rmutt/posts/pfbid0Ba9jKJybSD8VV88kQd85SB3RWhRY5GTVh7bbes3begdK4FADxbaHvaYqqqEYsV8Yl" alt=""></Photo>
</div> </div>
</div> </div>
<div className="grid gap-4 content-center"> <div className="grid gap-4 content-center">
<div> <div>
<Photo src="/images/photos/graphic-design/attaste/attaste-logo.jpg" href="https://www.facebook.com/attaste.rmutt/" alt="Attaste Logo" dim="false"></Photo> <Photo src="/images/photos/graphic-design/attaste/attaste-logo.jpg" href="https://www.facebook.com/attaste.rmutt/" alt="Attaste Logo" ></Photo>
</div> </div>
</div> </div>
<div className="grid gap-4 content-center"> <div className="grid gap-4 content-center">
<div> <div>
<Photo src="/images/photos/graphic-design/attaste/attaste-full-page.jpg" href="https://www.facebook.com/Fashionrmutt/posts/pfbid0GYU1Mb7iAqdJGEW38uLmf3y9LuHvXdWWk82TPw2TzaN5i4gZMmLjH1mzFK2XmFedl" alt="" dim="false"></Photo> <Photo src="/images/photos/graphic-design/attaste/attaste-full-page.jpg" href="https://www.facebook.com/Fashionrmutt/posts/pfbid0GYU1Mb7iAqdJGEW38uLmf3y9LuHvXdWWk82TPw2TzaN5i4gZMmLjH1mzFK2XmFedl" alt=""></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/graphic-design/attaste/attaste-full.jpg" href="https://www.facebook.com/Fashionrmutt/posts/pfbid0GYU1Mb7iAqdJGEW38uLmf3y9LuHvXdWWk82TPw2TzaN5i4gZMmLjH1mzFK2XmFedl" alt="" dim="false"></Photo> <Photo src="/images/photos/graphic-design/attaste/attaste-full.jpg" href="https://www.facebook.com/Fashionrmutt/posts/pfbid0GYU1Mb7iAqdJGEW38uLmf3y9LuHvXdWWk82TPw2TzaN5i4gZMmLjH1mzFK2XmFedl" alt=""></Photo>
</div> </div>
</div> </div>
</div> </div>
@ -177,31 +177,31 @@ export default function Hobbies() {
<div className="grid grid-cols-3 md:grid-cols-5 gap-6"> <div className="grid grid-cols-3 md:grid-cols-5 gap-6">
<div className="grid col-span-2 content-center"> <div className="grid col-span-2 content-center">
<div> <div>
<Photo src="/images/photos/graphic-design/supta/monday.jpg" href="https://www.facebook.com/photo?fbid=617881087113710&set=pcb.617882217113597" alt="" dim="false"></Photo> <Photo src="/images/photos/graphic-design/supta/monday.jpg" href="https://www.facebook.com/photo?fbid=617881087113710&set=pcb.617882217113597" alt=""></Photo>
</div> </div>
</div> </div>
<div className="grid content-center"> <div className="grid content-center">
<div> <div>
<Photo src="/images/photos/graphic-design/supta/tuesday.jpg" href="https://www.facebook.com/photo?fbid=617881563780329&set=pcb.617882217113597" alt="" dim="false"></Photo> <Photo src="/images/photos/graphic-design/supta/tuesday.jpg" href="https://www.facebook.com/photo?fbid=617881563780329&set=pcb.617882217113597" alt=""></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/graphic-design/supta/wednesday.jpg" href="https://www.facebook.com/photo?fbid=617881700446982&set=pcb.617882217113597" alt="" dim="false"></Photo> <Photo src="/images/photos/graphic-design/supta/wednesday.jpg" href="https://www.facebook.com/photo?fbid=617881700446982&set=pcb.617882217113597" alt=""></Photo>
</div> </div>
</div> </div>
<div className="grid content-center"> <div className="grid content-center">
<div> <div>
<Photo src="/images/photos/graphic-design/supta/thursday.jpg" href="https://www.facebook.com/photo?fbid=617881093780376&set=pcb.617882217113597" alt="" dim="false"></Photo> <Photo src="/images/photos/graphic-design/supta/thursday.jpg" href="https://www.facebook.com/photo?fbid=617881093780376&set=pcb.617882217113597" alt=""></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/graphic-design/supta/friday.jpg" href="https://www.facebook.com/photo/?fbid=617881620446990&set=pcb.617882217113597" alt="" dim="false"></Photo> <Photo src="/images/photos/graphic-design/supta/friday.jpg" href="https://www.facebook.com/photo/?fbid=617881620446990&set=pcb.617882217113597" alt=""></Photo>
</div> </div>
</div> </div>
<div className="grid content-center"> <div className="grid content-center">
<div> <div>
<Photo src="/images/photos/graphic-design/supta/saturday.jpg" href="https://www.facebook.com/photo/?fbid=617881097113709&set=pcb.617882217113597" alt="" dim="false"></Photo> <Photo src="/images/photos/graphic-design/supta/saturday.jpg" href="https://www.facebook.com/photo/?fbid=617881097113709&set=pcb.617882217113597" alt=""></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/graphic-design/supta/sunday.jpg" href="https://www.facebook.com/photo?fbid=617881310447021&set=pcb.617882217113597" alt="" dim="false"></Photo> <Photo src="/images/photos/graphic-design/supta/sunday.jpg" href="https://www.facebook.com/photo?fbid=617881310447021&set=pcb.617882217113597" alt=""></Photo>
</div> </div>
</div> </div>
</div> </div>
@ -215,38 +215,38 @@ export default function Hobbies() {
<div className="grid grid-cols-4 max-md:flex max-md:flex-col max-md:justify-center gap-6"> <div className="grid grid-cols-4 max-md:flex max-md:flex-col max-md:justify-center gap-6">
<div className="grid col-span-2 content-center"> <div className="grid col-span-2 content-center">
<div> <div>
<Photo src="/images/photos/language/etymology/december.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid0F5B2pYJpxFn4zTz4gRnRJiyrJk39cyBU12h3UF2CMCZZHuDX3Ucf7w5bkHCuXCLWl" alt="" dim="false"></Photo> <Photo src="/images/photos/language/etymology/december.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid0F5B2pYJpxFn4zTz4gRnRJiyrJk39cyBU12h3UF2CMCZZHuDX3Ucf7w5bkHCuXCLWl" alt=""></Photo>
</div> </div>
</div> </div>
<div className="grid col-span-2 content-center"> <div className="grid col-span-2 content-center">
<div> <div>
<Photo src="/images/photos/language/poetry/rain.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid0xhGCHH5ripFCLY98k9R2gLvwBVUEQC7cHj2XNAeMjdWWFzg6ytqdbs3pUmVo7sQ4l" alt="" dim="false"></Photo> <Photo src="/images/photos/language/poetry/rain.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid0xhGCHH5ripFCLY98k9R2gLvwBVUEQC7cHj2XNAeMjdWWFzg6ytqdbs3pUmVo7sQ4l" alt=""></Photo>
</div> </div>
</div> </div>
<div className="grid col-span-4 content-center max-md:hidden"> <div className="grid col-span-4 content-center max-md:hidden">
<div className="grid grid-cols-4 gap-x-4"> <div className="grid grid-cols-4 gap-x-4">
<div> <div>
<Photo src="/images/photos/language/poetry/megabangna.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid02bBs5rRF1HvusMHszwTFoQvX6dRoyMRfvDeJW44UAVG1V2cnTGW1heezpUnn8rXX7l" alt="" dim="false"></Photo> <Photo src="/images/photos/language/poetry/megabangna.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid02bBs5rRF1HvusMHszwTFoQvX6dRoyMRfvDeJW44UAVG1V2cnTGW1heezpUnn8rXX7l" alt=""></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/language/poetry/cosplay.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid02Rb7QKDbxU2FAttBJZ7UEitWtZ3nd9JXBMyB73eckRwqsnYbxTBvXwWFwU2SVF8BFl" alt="" dim="false"></Photo> <Photo src="/images/photos/language/poetry/cosplay.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid02Rb7QKDbxU2FAttBJZ7UEitWtZ3nd9JXBMyB73eckRwqsnYbxTBvXwWFwU2SVF8BFl" alt=""></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/language/etymology/sukhee.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid0Gx4DUbn8Y3xYiv2SctfqZpaXyNbSmosUDmVhHSt45Fk71jjDfNth9n1mpder2Howl" alt="" dim="false"></Photo> <Photo src="/images/photos/language/etymology/sukhee.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid0Gx4DUbn8Y3xYiv2SctfqZpaXyNbSmosUDmVhHSt45Fk71jjDfNth9n1mpder2Howl" alt=""></Photo>
</div> </div>
<div> <div>
<Photo src="/images/photos/language/etymology/jaturmitr.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid02DQjru8LZvyStPFcvWXWXkTtVRWjAkqSYeST9p5Kw5ZLYb9zMeQyF4mBQrsGMVsTHl" alt="" dim="false"></Photo> <Photo src="/images/photos/language/etymology/jaturmitr.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid02DQjru8LZvyStPFcvWXWXkTtVRWjAkqSYeST9p5Kw5ZLYb9zMeQyF4mBQrsGMVsTHl" alt=""></Photo>
</div> </div>
</div> </div>
</div> </div>
<div className="grid col-span-2 content-center"> <div className="grid col-span-2 content-center">
<div> <div>
<Photo src="/images/photos/language/poetry/bus.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid02sBVdxeKb2Q7hWnR2hPbbCohPrj4g5CMC2gbXkE9bzKuiZDXS1PewXZpaWz4DKpL2l" alt="" dim="false"></Photo> <Photo src="/images/photos/language/poetry/bus.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid02sBVdxeKb2Q7hWnR2hPbbCohPrj4g5CMC2gbXkE9bzKuiZDXS1PewXZpaWz4DKpL2l" alt=""></Photo>
</div> </div>
</div> </div>
<div className="grid col-span-2 content-center"> <div className="grid col-span-2 content-center">
<div> <div>
<Photo src="/images/photos/language/etymology/manusya.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid02fw5D5uXxwoKQjuSQe16Pf4eCaaH9fyM6jt3yZDgeeZZdhnSPXg7AiM1tqhtYyYyrl" alt="" dim="false"></Photo> <Photo src="/images/photos/language/etymology/manusya.png" href="https://www.facebook.com/WinsDominoes/posts/pfbid02fw5D5uXxwoKQjuSQe16Pf4eCaaH9fyM6jt3yZDgeeZZdhnSPXg7AiM1tqhtYyYyrl" alt=""></Photo>
</div> </div>
</div> </div>

View File

@ -28,7 +28,7 @@ export default function Home() {
</div> </div>
<div className="col-span-3"> <div className="col-span-3">
<h2 className="text-3xl font-bold mt-2">About</h2> <h2 className="text-4xl font-bold mt-2">About Me</h2>
<p className="text-base mt-4"> <p className="text-base mt-4">
My main field of work is creating <a className="font-bold underline decoration-2 decoration-sky-500">web applications</a>. I specialize in <a className="font-bold underline decoration-2 decoration-indigo-500">backend development</a> with <a className="font-bold underline decoration-2 decoration-pink-500">Node.js</a> and <a className="font-bold underline decoration-2 decoration-indigo-500">PHP</a>, as well as working with <a className="font-bold underline decoration-2 decoration-indigo-500">relational databases</a>, My main field of work is creating <a className="font-bold underline decoration-2 decoration-sky-500">web applications</a>. I specialize in <a className="font-bold underline decoration-2 decoration-indigo-500">backend development</a> with <a className="font-bold underline decoration-2 decoration-pink-500">Node.js</a> and <a className="font-bold underline decoration-2 decoration-indigo-500">PHP</a>, as well as working with <a className="font-bold underline decoration-2 decoration-indigo-500">relational databases</a>,
such as <a className="font-bold underline decoration-2 decoration-pink-500">MySQL / MariaDB</a>. such as <a className="font-bold underline decoration-2 decoration-pink-500">MySQL / MariaDB</a>.

View File

@ -24,8 +24,115 @@ export default function Projects() {
<div> <div>
<div className='mb-4'> <div className='mb-4'>
<h2 className="text-3xl font-bold my-2">System Administration</h2> <h2 className="text-4xl font-bold my-2">System Administration</h2>
<p className="text-base">All of my homelab equipment are inter-connected under the <Link href="https://winscloud.net"><span className="font-bold underline decoration-2 decoration-green-500">WinsCloud</span></Link> ecosystem. </div>
<div className='mb-4'>
<h2 className="text-3xl font-bold my-2">Enterprise Systems</h2>
<p className="text-base">
I work as a <span className='font-bold underline decoration-2 decoration-sky-500'>part-time job</span> at my family business company, <span className='font-bold underline decoration-2 decoration-blue-500'>EMPower Engineering Co.,Ltd</span>.
I work with designing, operating and maintaining the company&apos;s <span className='font-bold underline decoration-2 decoration-indigo-500'>computer infrastructure</span> along with the company&apos;s I.T. department.
</p>
</div>
<div className='grid grid-cols-6 gap-4'>
<div className='col-span-6'>
<h3 className='text-2xl font-bold my-2'>Hardware</h3>
<p className="text-base">
The server rack below consists of many components. Ranging from network equipment such as: <span className='font-bold underline decoration-2 decoration-purple-500'>routers and switches</span> to server equipment such as: <span className='font-bold underline decoration-2 decoration-pink-500'>storage servers and security camera servers</span>.
</p>
</div>
<div className="col-span-6">
<div className="grid grid-cols-2 md:grid-cols-4 gap-6">
<div className="grid gap-4 content-center">
<div>
<Photo src="/images/photos/company/main-server-rack/20231221_151039.jpg" alt="Main Server Rack"></Photo>
</div>
</div>
<div className="grid gap-4 content-center">
<div>
<Photo src="/images/photos/company/main-server-rack/20231221_132903.jpg" alt="Router Closeup"></Photo>
</div>
</div>
<div className="grid gap-4 content-center">
<div>
<Photo src="/images/photos/company/main-server-rack/20231221_133050.jpg" alt="MikroTik Cloud Router Switch"></Photo>
</div>
</div>
<div className="grid gap-4 content-center">
<div>
<Photo src="/images/photos/company/main-server-rack/20231221_132830.jpg" href="https://cloud.winsdominoes.net" alt="Server Maintenance"></Photo>
</div>
</div>
</div>
</div>
<div className='col-span-6'>
<h3 className='text-2xl font-bold my-2'>Software</h3>
<p className="text-base">
Along with hardware, there must be... Software! These software are used for many purposes, such as <span className='font-bold underline decoration-2 decoration-yellow-500'>server monitoring</span>,
<span className='font-bold underline decoration-2 decoration-lime-500'>file storage and transfer</span>, a DNS server and so on.
</p>
</div>
<div className='col-span-6'>
<div className="grid grid-cols-2 max-lg:flex max-lg:flex-col max-lg:justify-center gap-6">
<div className="content-center">
<div className='flex flex-col'>
<Photo src="/images/photos/company/raspberry-pi-file/20231221_151414.jpg" href="https://cloud.winsdominoes.net"></Photo>
<h5 className='text-xl font-bold'>File Transfer</h5>
<p className='text-base'>
This is a touchscreen Raspberry Pi that handles all <span className='font-bold underline decoration-2 decoration-rose-500'>CNC-related file transfers</span>, designed and installed by me and the I.T. department.
</p>
<h5 className='text-lg font-bold mt-2'>Usage</h5>
<ul className="list-disc ml-4">
<li>
Engineers, sitting in the office, connects to the Pi using the <span className='font-bold underline decoration-2 decoration-rose-500'>SMB (Samba) protocol</span>.
</li>
<li>
Engineers copy the files over to the Raspberry Pi over the network.
</li>
<li>
The <span className='font-bold underline decoration-2 decoration-sky-500'>CNC machine operators</span> copies the files straight to the CNC machine.
</li>
</ul>
<p className='text-base mt-2'>
This project has received <span className='font-bold underline decoration-2 decoration-green-500'>numerous positive feedbacks</span> from machine operators and are still being used in production to this day.
</p>
</div>
</div>
<div className="content-center">
<div className='flex flex-col'>
<Photo src="/images/photos/company/main-server-rack/20231221_151027.jpg" href="https://cloud.winsdominoes.net"></Photo>
<h4 className='text-xl font-bold'>Networking</h4>
<p className='text-base'>
Raspberry Pis are also used in networking systems such as: internet speed monitoring and as a DNS server.
</p>
<h5 className='text-lg font-bold mt-2'>Pi-Hole</h5>
<p className='text-base'>
Seen on the left side of the screen, <Link href="https://pi-hole.net" className='font-bold underline decoration-2 decoration-indigo-500'>Pi-Hole</Link> is used as the main DNS server, in which, the company&apos;s network traffic must go through Pi-Hole before entering the Wide Area Network.
This also provides additional DNS protection & control to the already installed firewall.
</p>
<h5 className='text-lg font-bold mt-2'>Grafana Monitoring</h5>
<p className='text-base'>
The <Link href="https://github.com/geerlingguy/internet-pi/" className='font-bold underline decoration-2 decoration-indigo-500'>internet-pi</Link> set of software, consisting of Grafana and Ansible, provides the I.T. department with additional networking monitoring such as:
Connection speeds, latency, HTTP duration and much more.
</p>
</div>
</div>
</div>
</div>
</div>
<div className='mt-10'>
<h2 className="text-3xl font-bold my-2">Homelab</h2>
<p className="text-base">In addition to business systems, I also have a homelab! My homelab equipment are inter-connected under the <Link href="https://winscloud.net"><span className="font-bold underline decoration-2 decoration-green-500">WinsCloud</span></Link> ecosystem.
This is where I run most of my <span className="font-bold underline decoration-2 decoration-sky-500">self-hosting</span> instances of various <span className="font-bold underline decoration-2 decoration-indigo-500">open-source software</span> such as file storage servers, music streaming services, network monitors, and so on. </p> This is where I run most of my <span className="font-bold underline decoration-2 decoration-sky-500">self-hosting</span> instances of various <span className="font-bold underline decoration-2 decoration-indigo-500">open-source software</span> such as file storage servers, music streaming services, network monitors, and so on. </p>
</div> </div>
@ -228,10 +335,11 @@ export default function Projects() {
<div className="transition ease-in-out delay-150 hover:scale-105 duration-300"> <div className="transition ease-in-out delay-150 hover:scale-105 duration-300">
<video <video
autoPlay autoPlay
controls
muted muted
loop loop
className='rounded' className='rounded'
src="/images/photos/school-work/robotics/lego-league/robot-movement-final.mp4"> src="/images/photos/school-work/robotics/lego-league/robot-movement-final.webm">
</video> </video>
<span className="text-xs m-2 text-zinc-600 dark:text-zinc-400">First LEGO League Robot Test Run</span> <span className="text-xs m-2 text-zinc-600 dark:text-zinc-400">First LEGO League Robot Test Run</span>
</div> </div>
@ -286,7 +394,7 @@ export default function Projects() {
<h2 className="text-3xl font-bold">Science</h2> <h2 className="text-3xl font-bold">Science</h2>
<p className="text-base"> <p className="text-base">
I participated in Rugby School Thailand&apos;s <a className="font-bold underline decoration-2 decoration-indigo-500">Senior Open Day</a>, where all academic departments get to present their syllabus and curriculum to visitors that are looking into joining the school. I participated in Rugby School Thailand&apos;s <a className="font-bold underline decoration-2 decoration-indigo-500">Senior Open Day</a>, where all academic departments get to present their syllabus and curriculum to visitors that are looking into joining the school.
I voluntarily came to help the <a className="font-bold underline decoration-2 decoration-sky-500">Physics department</a> in presenting <a className="font-bold underline decoration-2 decoration-pink-500">IGCSE and A-Level Physics concepts</a>. I volunteered to come and help the <a className="font-bold underline decoration-2 decoration-sky-500">Physics department</a> in presenting and explaining <a className="font-bold underline decoration-2 decoration-pink-500">IGCSE and A-Level Physics concepts</a>.
</p> </p>
<div className="grid grid-cols-6 gap-4"> <div className="grid grid-cols-6 gap-4">

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 MiB