Hi there.... this site is still under construction so some of the pages are still missing and nothing is final

Diary

this page is a sort of online diary where i share my thoughts, feelings and interests... be warned that i will talk about topics that may trigger some people like self harm and other mental illness related things... this is in no way intended to romanticise these issues... it's only an outlet for me to talk about my problems

02 Nov 2021

Almost Wipe Out My Project Again

Ohhh... my godnesss...
I'm almost wipe my entire progress again lmao...

i always forget to commit my progresss...
so i am trying to use xampp instead of built in hugo server

i build and watch my website to xampp htdocs folder
then i realized hugo didn't remove old unused files...

there is --cleanDestinationDir flags... but it just wipe the entire folder...
i have another stuff too in htdocs folder that i didn't want to remove...

then i make a simple batch file to remove all file excluding some folder that i want to keep
the problem is... i am not quite experienced with windows batch syntax...

i am always use linux most of the time...
but currently i am using windows right now....

i am search online and managed to make this script

for /F "delims=" %%i in ('dir C:\xampp\htdocs\ /b') do if not "%%i"=="SomeFolderHere" (rmdir "%%i" /s/q || del "%%i" /s/q)

you see the problemm...

here...
at this part (rmdir "%%i" /s/q || del "%%i" /s/q)

i completely forget to include the folder path...
that means it will delete file in the current path where the batch file located...

and you know where i put the batch file is?

yess... correct...
in the root project file...

it almost wipe my project...

luckily it only delete index layout...
which is really easy to recover...

thx god...

this could be a lesson...
from now on i am gonna commit all my changes....

01 Nov 2021

New Font for the Website

Its now a new month everyone...!!
well... its depending on your location actually...

anyway... i decided to change the font...
in the previous post... i though the problem was i didn't include multiple font format...
this wasn't the case... it was the font itself...
its kinda wierdd... i really love that font actually...

this is the previous font that im using Grandstander
but i didn't wanna cause anymore confusion when designing layout...

soo yeah... its time to change it...
for now i am using Bubblegum Sans...
it is free for personal use... soo don't mind if i do....

i choose more generic looking font...
so that it render consistent on desktop and mobile...
well it looks the same on my laptop and phone... i dunno with other ppl phone...

oh... im also change a bit in page layout...
just to make things easier to read...

im really struggle reading loong text like this one old design...
i guess using gradient background on text isnt a good idea lol...

28 Oct 2021

Upgrading My Ancient Laptop

yoo....it arrive...
i bought new ram a few days ago...

it is just basic 4gb ram... yeah its nothing big actually...
ive been using 2gb ram for a very long time...

recently i want to use vscode to do my coding stuff...
it is bit heavy for my old laptop...
i cant open anything in the background when i use vscode...
soo yeahh.. i need more ram for that...
i like vscode because how powerful it is...

noww.. i can do any multitasking without problem...
it also improve a bit when i do browsing...
its kinda much smoother... especially when i scroll through the web...

in case you're wondering what laptop did i use...
it is Lenovo G485 ...

uhm..yeah i know...it is really old one...
i dont do gaming on my laptop...

using old slow laptop not really a problem for me...
mostly i use my laptop just for drawing and coding...

its work perfectly finee...

27 Oct 2021

Problem When Click Image to Fullscreen

hi there...!!

uhmm ok... i want to talk about this little simple feature...
it is called something like lightbox image thingy??
basically here how its work...

there is an image... you click it.. then it get into fullscreen mode...
just like the one you found in medium right??

i want that featurree...
but... as you already now...

im just a lazy person.. so i went into google to find somekind of framework...
then i found this one called....lightense-image
its is pretty simple and does what i wanted....
but there is some issuee... somehow its kinda broken when using container with flex display...
when i try to zoom....it didnt center perfectly...
there is this github issue...
they said try to wrap the image inside div... i did... it work when you didnt resize the div...
but in my case... i need to resize the div... and when i do that.. it just broken...

am also try bunch of other framework but it just straight wierd, bloated, and annoyingg...
i cant find one that work perfectly for me...

aight then... guess i have to make my own...

here is the main problem with the other framework that i tried...
they just take the current image when im click it then make it fullscreen...
after i close the fullscreen mode they tried to move it back to the original place...
some framework even place it at wrong position and just broken lol...

that just too much work...
i can do better...
what if instead of use the current image...
you just make copy of it...
append to body... set the z-index to the front...
then when you want to close it... just simply destroy it...
that way you didnt need to move any image... easyy...

here some proof of concept...
it work like a charm... try to click those cute imagee..

of course it is in flex display...
i need to change the div size so i can use object-fit style on the image...
i think lightense-image just freak out whenever i use object-fit inside flex item...

thats cool... but sure it need more improvment...
for now it just really basic...

im planning to add more feature...
like you can actually zoom in/out certain part and use drag event to move...

just make small ui... slider perhaps... to zoom in/out...
and for the drag event.. it just simply add the event listener done...

also i want lazy load image too... this one is bit tricky...
this one you need two image... the actual image HD quality and the thumbnail...

the image will show the thumbnail one.. but when you click it.. it show the HD one...
this gonna save lot of data usage especially when your bandwidth is limited like mine lol...

this one is bit tricky because i didnt want to make two image...
instead i want to make it automatically generated the thumbnail...

Hugo already support this feature... but... it only work on layout... not the markdown file...

there is a way... using this thing called shortcode...
i really didnt like to setup that thing...
it is not that hard... just annoying...

i swear in jekyll you can use any function inside the markdown if i remember correctl (i could be wrong thoo)...
why Hugo... just make it.. it gonna make thing easier...

yeah but for now im gonna leave it that way..
it is good enough already...

ohh boii... this one is a really long talk xD
i can keep going but i need to really stop here lol...

okay see you on the next post i guess...

27 Oct 2021

The Font Are Different

This is something i didn't think gonna happened...
soo...

hm....i just realized that font render different on mobile and desktop browser...
especially my font that im using right now...

this really mess up my padding size...

(Left are from desktop, right from mobile)

The size are bit different?
i only noticed right now because im used to use my phone as secondary display to preview live reload of my website...

what? the image too small?? you cant see it because you cant zoom the image? uppss my bad...
currently i haven't implemented click to zoom yet...
i don't know what it called... there is maybe a framework for it...

*Edit i already implemented it.. click the image to fullscreen (kinda off, check my next post)

anyway...

i rarely preview it on desktop
because you know how browser nowdays really taking lot of resource...
and i only have this dinosaurs's age laptop...

speaking of my laptop... im already order new ram
i bought 4gb ram... yeah its better than 2gb ram that im using right now...
it should arrive in 1-2 days...

ok... i think this is because the font format im using??
im not sure yet... you know how browser sometimes require multiple type of font?
yeah i just skip and use single ttf instead... maybe that the cause??

i haven't check it yet...
there is two solution thoo...
if im correct i should provide the other font type... but here's the problem...
i don't remember if the font i use have the other font type...
and i pretty sure i cant just convert it and call it a day...

the other solution is just use another font...
but again... i love this font... its look very interesting... and i love it...

welp...if i cant resolve this issue....
maybe im just gonna use this font and ignore anything lmaoo...

who cares about the design being ruined just because the scale are different...
this is my website anyway... i can do anything i want...

27 Oct 2021

Why Im Using Hugo Instead

sooo.... Hugo right...
yess...

ok actually....
originally this project using hugo at the very beginning lol...
then i switch to vue3 because i want to learn like proper webdev using powerful framework...
at first it was going smoothh... but as the time goes on... it just getting harder to get things work the way i wanted to be...
mainly because im not a smart enough to understand how to do something...
there is like a lot of trick that i must use... it just doesn't feel right...

i always avoiding using webpack... it just to confusing for me...
i know how it work... but it just to confusing... lot of config that i didn't quite understand i just simply copy paste from site like stackoverflow...
i usually use browserify to build any js web thingy... it much simpler and didn't require lot of config...

after that i just said enough... this is too much for me...
im just wanted to make simple website so i can share anything i like....
not to be confused by all the framework thingy...

don't get me wrong... i love vue3.. the learning curve is really friendly for hobbyist programmer like me...
but im not ready to use it... for now... im just wanted something simple enough...

then i found this cms called CraftCMS...
it really easy and i love it...
i rebuild my website and convert all my layout to this cms...

it was fun until yeah... i decided to reinstall my os and completely forget to backup the database...
i haven't push the website to live server yet... so yeah only layout and web data survive...
and i lost interest to recover all my work...

after a few month i want to comeback...
i got all the layout and stuff... i just need to construct it back...
i didn't want to use database anymore... because im scared all my data gone again...
i just want a everything all in one folder...
so it easier to do a backup

it sound like the job for static site generator right...
im still got all old layout when im still using hugo...

it much easier to convert my new layout which is using CraftCMS to Hugo because they share almost identical syntax....

and that brings us here....
a very simple static site using hugo...

i just do a full circle back to hugo lol...

ohh yeah... im aware there is other static site generator like jekyll or nextjs...
i prefer hugo just because i already familiar with it

10 Oct 2021

Start a new Page

Start a New Page

Hi...!!!

soo.... lot of things happened lol...

i was working on this site content (in my local env)
i made lot of blog post... about 15 post i guess

then i wanted to change my windows version...
i did backup my file... but i forget to backup database of this site...

previously im using CraftCMS so all the content stored inside database...
the only things i backup was the web file... like layout and assets stuff...
the content it self is gonee...

soo... yeahh... i just stop working on this site and cry in the corner lmao...

its been a while thoo...
i guess im gonna start writing again...

ohh and yeah i didn't use CraftCMS anymore...
instead im using Hugo... which is static site generator...
there is lot of pros and cons why i switch to static site generator...

one of them is i didn't need database anymore...
so i can easily backup using git or just directly compress the entire project to zip lol...

anyway... im gonna busy writing lot of stuff here...
see you in the next post lol...