lukasreis.com banner

lukasreis.com

21 devlogs
70h 59m 44s

My personal website! Made with Astro
With Blog and Projects

Loading README...

Lukas

Shipped this project!

This was already a while back cant remember exactly what i did but i added api support and more technical stuff

Lukas

Added to github pages and fixed a few small things

Attachment
0
Lukas

Fixed stuff on the backend and make everything cleaner and better eg: added api keys as export variables so i can easily commit to github without having to censor the api keys

Attachment
0
Lukas

So now that the website in desktop and mobile is already pretty good i started making the backend firstly all self hosted on localhost but in the near future i’m going to host it on my Rpi 5 so yall can experience it

I want to say that the backend was heavily made with the help of amp code i personally don’t like vibe coding much but trust me me and JS don’t go together but still i now understand learned much more how everything works so i’m not one of those people who just vibe code and then don’t learn anything.

the backend right now gets song name artist and image from last.fm and then my frontend gets the those and displays them on my website

0
Lukas

So I made the whole home page better for mobile which was very hard because i had lots of constraints in the desktop so i had to make a bit of custom html for mobile very small but still annoying but the hardest part was the homepage projects they took so much work to even get them somewhat good and i was trying to get them with images but it just did not work it was so hard oh my god

now there is only left making the text a bit smaller its too big for mobile

0
Lukas

This devlog will cover quite a lot of progress! So i started on actually coding the mobile version and at first it was a bit a pain in the butt but then everything started to click and I LOVE CSS its so easy and good.

Here is a list of things i worked on

  • Added a footer/nav instead of header/nav for mobile
  • Made cards and pages work on mobile with sizing and stuff
  • Converted Blog post and Projects page better for mobile
  • Actuall blog posts actually work
0
Lukas

Added a last commit which somehow only works on localhost and need to fix that and starting to write a about me page so people can know me better and i can share my favirute things!

Attachment
Attachment
0
Lukas

Wrote the blog post untill the end and its already live and started making more of the mobile version on figma which is quite hard to get the same type of style in mobile and desktop

Attachment
Attachment
0
Lukas

Made a better giscus theme which i’m actually happy with and it was hard and then already started to write my second blog post called: What Is Hack Club and it talks what Hack Club means to me and some other things about hack club

Attachment
Attachment
0
Lukas

ehm so well this is going to be hard to explain why i have so many hours so basically i added comments on the blog posts with giscus and i want to make my own styles but oh my god its hard and every change i make i have to commit so it can get the custom theme and its taking so long to get the colors right and its still not done i might just do something like adding everything the same color like all purple with white outlines so its way simpler to make but this has been a pain in the ass

oh yeah almost forgot the blog/tutorial is done that also took like 4 hours to write but it should be good

Attachment
Attachment
Attachment
0
Lukas

Shipped this project!

Hours: 48.87
Cookies: 🍪 194
Multiplier: 3.96 cookies/hr
  • Learned how to program (Yes its true)
  • Learned how to use Astro
  • Made a Blog system with .md files
  • Projects Page for my best projects that i want to share
  • Small client side JS for hours and .md file sorting
Lukas

I styled the blog posts and some of the pages also work better on smaller screens and i’m also writing a blog post and a tutorial for my blog

Attachment
0
Lukas

Whoops so much time went without devloging well at least i was only working on 1 thing which was the blog system! Which i got working after well about 10 hours because i first tried to make a version all by my self and i was getting very lost many times but then i remembered that haxmas day 11 had a guide on how to make a blog website and i took lots of inspo but also deleted many many uneeded lines even with the guide it was hard because maybe half or more of the code was still mine the guide only gave me a foundation which was really helpfull and now i have a system where i can just create a new .md file with a frontmatter and then the content and it will atomaticly add it to the /blog page and in the homepage and oh my god its sooo good but my folder and file structure not so much i really need to clean it up

Attachment
Attachment
Attachment
Attachment
Attachment
0
Lukas

Today added minor things.

i added metadata, fixed some height issues, added a hackclub banner, fixed an issue with an image.

yeah thats all just minor things that change lots of things internally

Attachment
0
Lukas

So i did lots of things no many visual but added some more projects and cleaned up things as always and i put already a WIP version online! you can check it at lukasreis.com its up!!! also added the blog page no backend yet tho :pf: but looks good

Attachment
Attachment
0
Lukas

Added a JS clock! I made a clock that of course is locket to my time zone and it works its so awesome to see everything come together so well

i used temporal.now to get the clock locked to UTC

Attachment
1

Comments

Lukas
Lukas about 1 month ago

again this buged and the actual clock image does not show

Lukas

Added a few projects already i really wanted to see how would they look and its getting really good they look really good

for the projects i created a folder at src/projects and i put every project there to use in the homepage and then in the projects page

Attachment
Attachment
Attachment
0
Lukas

I have no idea how i took so long to:
Add a few things to the homepage
clean lots and lots of code i had so many classes and stuff that was just doing nothing and oh my god it took really long to clean all my files and also name scheming for classes and files.

minor but also added license to the footer.

hour and status will be changed to my local time and status will be if i’m online or offline on slack

Attachment
Attachment
Attachment
0
Lukas

So i started working on the actual projects page first of course made a version in figma and at the same time i also tried somethings for the blog page. But yeah already making the basic things for the page

Attachment
Attachment
Attachment
0
Lukas

Woah i did so much in so little time (for me) uhm yeah the home page is soo done. So i basically added the blog and projects parts in the homepage and that took also really long again because of the grids that i’m still getting the hang of but again this is coming together just as i had imagined it (and designed on figma)

Attachment
0
Lukas

So i made the homepage better and oh my god it took so long because of all the nesting with css grids and it was a headache to get it working well but in worked out! And i’m so happy with what i got

Attachment
Attachment
0
Lukas

So i figured out shit

what was broken:

  • Resizing window broke header
  • Did not have box sizing set (which broke lots of things)

And then i added/fixed some other things including:

  • better homepage (still a bit broken but its an easy fix)
  • Cleaned things in general css html stuff
0
Lukas

Woah so uhm it has been 14 hours of work already so i’ll make a brief list of everything that i did.
this will be listed in the order that i worked on them

  • Found a cool color scheme that i had the idea while dreaming it contains: Purple, Darker Purple, Yellow, Dark Grey, White.
  • Started Designing in Figma the idea of the website this took maybe a third of the time but i got basically the whole idea and vibe of the website.
  • Decided to use Astro to make my website (BTW im a programing noob).
  • Fell in love with Astro! I had never had this feeling its so good finally understanding how everything works.
  • Started getting the hang of actually programing.
  • Worked on the Header and its basically done. and it has a nav and a clean look and its fixed in place
  • Made a simple footer and its good enough for now.
  • Working on the body with a css grid to get all the “Cards” in the right place which only now I’m almost getting it working.
1

Comments

Lukas
Lukas about 1 month ago

i added more photos and videos but smh they are broken and only 1 video shows up