LocalBusinessStudentTutoringWebsite banner

LocalBusinessStudentTutoringWebsite

13 devlogs
41h 4m 52s

This is a project where I create a hosted website for a hobby/small job of a friend who is tutoring students and helping them through school.
It also includes an account system, online payment functionality for parents to buy tutoring hours/group courses for their children, a calendar where all appointments show, etc..
All created by myself using only nodejs express, stripe and to make it at least bearable to write, Tailwind Css.
Not tooo focused on the absolute cleanest, perfect architecture yet as I usually am (like for example in C++/Java/… man I love C++), because this is frickin’ Javascript and wanting to write anything great in this language is inherently an ill-formed statement in and of itself already just by using Js in the first place. Still a very friendly (on the surface…) language with MUCH support so my workflow here’s using it :).
We’re German that’s why all the visual text/strings/(some comments) are in german too but code-wise it’s still english all the way.

This project uses AI

ChatGPT for ONE singular question about a monstrosity of an SQL expression I wrote that needed a single small change to properly work and ChatGPT helped with finding out this small detail. (The exact method also has a comment pointing out the little assistance of AI in it). Everything else (also of the expression) is handcrafted by me, as real hacker’s projects should be!

unicode101010

Heloo agaiiiin!

Quick devlog today about five whole days or so since the last one! Had to take a lil break (and will again until Wednesday next week I think), because I just wrote my first ever exam of university where I’m now studying after graduating in the middle of last year and I had to take some time to study for that. Went quite good, was about a whole lot of Java programming (no C++ in the first semester yet sadly ;((( ), but a very short amount of time we had for a not so small amount of tasks that were to complete. This was also my problem in all the last years of school the entire frickin time in computer science! (Not to flex or anythin, that’d be wierd, but) in every single exam I wrote I always received full points on every task I worked on; Problem was, I wasn’t ever able to work on all tasks in the first place and therefore neverrr(!) got a perfect score, although if I just had a liiittle more I would have always been able to get an A with full points… Very kinda frustrating man but whatever. At least these grades weren’t because of my skill but due to external factors.. (although… if you think about it, they may still have been because of that to begin with? Like the skill to be fast and efficient in task completion and stuff. Well, guess the grades were appropriate all along :c).

Anyways, back to the project!
Today just a content update they asked for where I updated some images, styles, a lot of text, the offers, and so on. Also sooome styling to fix broken dimensions and make the code a little cleaner but nothin’ else that’s too crazy :).

Have a good night and maybe until tomorrow, or next Wednesday as that’ll be the first day I’m free from studying again, having written my second ever exam on Tuesday. The next one after that is like 1.5 months away still that’s why I have time after this second one again :).
GG

Attachment
0
unicode101010

Release went perfectly good today!
Server is now accessible through our Domain Name from Porkbun, perfectly hosted by DigitalOcean, run via pm2 and reverse-proxied by nginx, PLUS I upgraded, wired and configured nginx and everything to use all the ssl and therefore https related stuff correctly right away so great that that works now too :D.

We were also talking about further steps and what to focus on now and yeah there are definitely still some things to do on the frontend-side. Backend and stuff like the admin panel for the team to have an interface to add content themselves in the background will come after all this the things new users see are more or less complete :).

Aight! We’ll see each other maybe tomorrow or the days after. May take a short break after this really activ development phase to have some free time again next to this project, my actual work, going to university and life stuff living by myself. Want to also continue my TALL ASS stack of personal projects and ideas at SOME point at least. Can’t be that I’ll turn 99 one day and still wasn’t able to work on any of them, even though I’m SO incredibly exited to start basically all of them at once but don’t have the time..! That would be sad. Like rlly rlly sad.
Maybe reading this made you think ‘bout your own stuff you really really would like to do but are just stuck with because of the limited time and all other things you have going on. All I can say is:
Sort your priorities, and just do the stuff you’re having fun with! Because that really is everything life is about. (After making sure you survive & got the necessary money for that n all, ykyk XD.)

Pretty philosophical here, but just go and have fun!
And as always; See ya :waving_hand:.

(PS: sorry I had no better image today without leaking IPs and stuff whoops)

Attachment
0
unicode101010

What’s poppin’!

Today I present to yooouuuu… (drum roollll)
Thee offers paage! haha

Ok yea I started & kinda finished a complete Css refactor on this page today, as it is the last of all the main pages that’s still missing really before we (tomorrow) can do our first release :).
(The shop page doesn’t have anything yet and just says “soon” and some other small pages like the error page or basically all the ones you get access to when you’re logged into your account are also still missing (at least their styling), but to continue over there I would first have to work on the backend again n do some stuff over there before I can integrate them with all the database interactions and so on required for the content I wanna show / you should be able to see on there. Header (top right part) also not fully perfect as of now. Think one can clearly spot that though hah.)
(Oh and while you can already buy yourself some of them sweet sweet stars right here, the calendar, so basically where you can spend them, is just purely visual as of now to be a placeholder for what’s to come on here in the near future :o.)

We’ll see how the release goes tomorrow and yyyyyeahh.. lot of work still to go for all the other pages and elements to work correctly and harmonize (is that a word lol?) with the backend.

Aight naight see ya ^^.

Attachment
0
unicode101010

Finished the homepage today with the “target groups” and small “contact” section :D. Think it turned out great again and actually only took 2:40 hours :o.

Again, tired & will continue tomorrow with the last public page before the first release!! The offer page where you see what we currently offer and can either book a custom appointment, or sign up for a course that you can select from a small calendar showing all the dates we organize one :).
We’ll see if I’ll managa that yo.

Stay f-f-f-fresh and good night ^^.
(Css wasn’t too evil to me today XD. One could even go as far and call it “quite pleasant” today & that’s crazy.)

Attachment
0
unicode101010

Today continued the homepage with this next grid like element listing what we “offer” to customers.

Think it turned out quite nice again, but it took sooooo long oh my god I did not know how and now I still don’t know why the hell Css’s grid and flexbox systems don’t provide a max column/row item count?? Like.. ? What am I supposed to do when I want to use a grid but it should only ever grow up to that many columns (e.g. with auto-fit) and never beyond? You would have to hack some calc() statement for the grid-template-columns Css attribute together and redundantly store extra variables for gap size, min column size, max column count, etc.. ooor just choose to redundantly update your values in different places whenever you change one of them. Like what are these workarounds I found you have to go through in order to acheive something conceptually so dang simple!?
Just. A. Maximum. Column. Count. That’s it…!

However I got around it by having to use a media query (which I always try to avoid) that changes the grid cols from 2 to 1 whenever it gets below 1024px as this width is carefully curated to fit my item div sizes. Still small redundancy like when I change the div size I also always have to verify the media query breakpoint width again if it still fits & switches at the correct point but other than that (and the fact that I’m having to rely on media queries to begin with) the cleanest way I found.

Don’t wanna rant about Css here every devlog but how can I not if things like this come up soo often >.<.

Good night (or morning or whatever wherever you are) and I hope I can get back to backend again soon :DDD. Frontend’s also fun but really becomes draining if it’s your full-time job OMG.

Attachment
0
unicode101010

Quick session on a sunday today because I slept in to be at least somewhat well-rested again before next week starts. (LAST week of this (my first) semester in computer science at university YAYY 🥳🥳🥳. Got a LOT of free time after that, but these 2 months are also where I write my exams soooo.. still have to do a lil bit of learning but otherwise great :D!)

About the changes in the project today; Css. I FINALLY got behind why my flex items (you see below the checkmarks, the text and image next to it) in a flex container with flex-wrap enabled are always INSTA wrapping and not even trying to shrink to then only wrap when no more shrinking (due to min-width) is possible.
You seemingly have to specify flex-grow and -basis to be at least something for this desired behavior to emerge. Wth man. I don’t fully understand this, but I honestly don’t want to plague my brain with every single detail and all the tiniest rules there are to the absolute shit-show that Css inherently is. I just wanna imagine some visuals & effects and know what to do to achieve exactly that. Not write a masters thesis about the inner workings of this hell of a system. And this is working rlly well so far!
Lil css rant this became here. Also has to happen sometimes.

Have good one again :D. I’ll continue in the next few days.

Attachment
0
unicode101010

Almost finished the home page today. And DAMN doing good Css yourself can take a lot of time.
Have to see now how I’ll style every section on the page (The vision, What we offer, About us (the team), For Businesses, Contact) each a little differently so they don’t just look copy pasted aass.

7 hours of Css (with a small WakaTime hackaclub downtime today, right?) sure is exhausting, but can be extremly satisfying at times too!

So let’s see when I’ll be able to finish this the perfectionist that I am… :)

Attachment
0
unicode101010

Continued with the homepage now. Still some work, but I’ll get there :). Veery tired now omg I just can’t ever go to bed early can I? -.-
Anyways, I also think WakaTime might have scammed me today because my wifi was gone for a bit while working and it somehow cut the tracked development time in two and this is only the second part after I got wifi again ;(. But also I worked in a text file a little that wasn’t tracked & stuff so maybe that adds to.
Idk maan I’m just tired and going to beed noow finally. Happy, as always, but tired.
Good night everybody reading this! (Probly very few if any at some point who knows :o.)

Attachment
0
unicode101010

Just finished some quick requested additions to the imprint (correct english word for that? lol) e.g. footer of the site to have it all legally compliant and stuff :).
Wanted to do more today but when I looked up from my youtube player there were suddenly way more hours on the clock than I remembered from looking the last time oops.
Anyways, will be gone tomorrow and the day after but after that I’ll work moore and get this thing onnliiiine finally I hope.
We’ll see about the https certificates though and how that’ll work out hosting it on the actual server :||. Only the second time I do this then. May take some hours but we’ll see!

Have good one! :]

Attachment
0
unicode101010

Today I did a LOT of CSS, mainly the “About us” page where all the team members are listed :).
Css truly is something, huh? But today’s a day like any other where I am just incredibly greatful again that TailwindCss exists <333. XD

okey see ya!

Attachment
1

Comments

Aaradhya Barnwal
Aaradhya Barnwal 17 days ago

I liked the colour combination . It makes it look clean.

unicode101010

Few attempts at the frontend from now on, today tryning to make the account balance (stars) show reasonably styled :). Not done yet but hover effects are quite cool :D.
Ahh TailwindCss my beloved.

Attachment
0
unicode101010

Today I refactored A LOT of the server code to the point where it’s now pretty bearable, by finishing the booking routes and putting all the algorithms in the abstractions they (for now) belong, as well as finally abstracting and cleaning up the stripe payment procedure.
I also changed the currency you can buy in packets utilizing stripe from minutes (you previously used to sign up to courses and other stuff, subtracting the duration minutes of the event from your balance (minutes as currency)) to a higher level system of “stars”. So you now just buy some amount of Stars you can then use to buy/sign up for whatever you want :D.

Next and last thing to be done now until the MVP version is completed is to fix & tidy up the entire frontend to incoorperate all new functionality, but also make it pretty while doing that ^^.

Attachment
1

Comments

unicode101010
unicode101010 19 days ago

It somehow didn’t upload the file of the stripe checkout page 🤷‍♂️

unicode101010

Continuing work - Refactored the database interaction and overall code that gets called with each email request (like login, accountDeletion, appointment request and so on) to have generic and to now have it (FINALLY, yesss!) outside the main server.js file.
Not sure if it entirely belongs there yet or if the request objects I made are good like that, but this abstracted system is finally happening and pretty good for how dehydrated & a little tired I am :D.

Ima go drink now. You should too!
Until then ^^.

Attachment
0