feat: many fixes and changes

mabasic · Sep 2, 2023 · aa9965f · aa9965f
1 parent a75e6f5
commit aa9965f
Show file tree

Hide file tree

Showing 22 changed files with 204 additions and 126 deletions.
diff --git a/.env.example b/.env.example
@@ -3,7 +3,7 @@ APP_URL=http://localhost:8000
 
 # Options: ses, log
 MAIL_MAILER=log
-MAIL_FROM_ADDRESS="mario@laravelista.hr"
+MAIL_FROM_ADDRESS="mario@laravelista.com"
 MAIL_FROM_NAME="Mario Bašić"
 
 AWS_ACCESS_KEY_ID=

diff --git a/.helix/config.toml b/.helix/config.toml
@@ -0,0 +1,2 @@
+[editor]
+auto-format = false
diff --git a/README.md b/README.md
@@ -4,54 +4,16 @@
 
 "n" in "n7" stands for the **number** of times that I have created a new personal website for myself. Meaning that this is the seventh time as I recall.
 
-## Summary
-
-My initial idea was to use Phel on the backend and Rescript on the frontend. I tried to build the backend to match the previous website (n6) which was built with Laravel. Routing, global middleware, validation, logging, mail, CSRF protection, configs, partials and layouts are all inspired by Laravel. **It took me around 14 days to complete this website (3-6.3.2021 to 20-21.3.2021).** Since I spent a whole bunch of time implementing backend features, when I came to the point of dealing with Javascript I decided to stick to the already existing javascript code from the previous website, but with improvements to the tooling (prettier, eslint, webpack, babel, prop-types) and data handling. I still want to switch from Javascript to something else, but that will probably have to be in the future. Recently, I have started learning about F# and Fable/Feliz and that got me questioning using Rescript on the frontend. Also there are other options like Elm or Dart. ~~Can't really decide.~~ _Decided to go with F#/Fable. See update bellow for more details._
-
-## Personal information
-
-This repository contains the source code for my personal website. The source code is publicly available for educational and informative purposes, but is given without any license because it contains my personal data and information. I do not grant any permissions for the source code except reading the source code for educational or informative purposes. I really wanted to keep the original development commit log, but I have accidentaly commited a license file at some point, which gave all permissions to my personal data. I know that there are ways of removing that one file from history, but it was much simpler to just create a new repository and copy the files over.
-
-## Future improvements
-
-In the future I plan on adding missing tests and replacing Javascript with something else. Initially, I have started with simple tests for pages and partials, but then I got busy with implementing features and finishing the website, so the tests fell behind.
-
-**Update 27.04.2021 F#/Fable**
-
-I've rewritten Javascript with F#/Fable. After reading about F# and F#/Fable, comparing it with Rescript and Elm, and trying to find a project to experiment with it I have decided to use Fable and write Javascript with F#. My goal was to go all in and not write a single line of javascript. **It is all F# now 100%.** The code that I wrote follows the same structure as the JS code as much as possible. This was my plan so that it is easier for me to view differences. Parts of code could have been written better if I did not follow the code structure from JS as much.
-
-Since I was/am new to the language I had to figure out a lot of stuff including the tooling, the ecosystem, the syntax, the libraries. The documentation for Fable could be better. There are so many options for everything. I had to find a React library, a JSON library and figure out how to do HTTP requests. There were times where I almost gave up on the F#/Fable rewrite.
-
-~~For archive purposes I've kept the original JS files in the source code so that I can compare the syntax and code in the future.~~
-
-**Update 24.05.2021 Blog**
-
-I've moved my blog from Gatsby.js to this website. In order to achive this I had to implement named route paramaters in the router, implement reading front matter/markdown from files and converting to html, implement better active route detection (laravelista/Ekko logic) and other related stuff. The whole process was simple, but I had to deal with regex and that was painful. Every time I have to lookup what each symbol means. I have added a bunch of tests and updated the application to Phel 0.3.2 which bring new data structures and fixes.
-
-**Update 23.07.2022 Removed webpack and F#/Fable**
-
-I used F# to build the contact form on the start page because I wanted to try F#. Since then I have started using F# whenever I can. My goal is to make a simple contact form with no JS. Phel renders html form, form submits and the user gets the response as html. Because of that I am removing F# from this repository. I have made a new tag called `fsharp-fable-start` where you can view the last working version of F#/Fable start page form.
-
-Because of this I have moved away from webpack to using rollup for js and sass for css. I think that this is very simple now to maintain and there are no hacks involved.
-
-## Phel-lang "review"
-
-Working with Phel was very fun and an interesting mind flex. The concept that code is data is mind blowing. This is my first encounter with a lisp inspired language and a functional language. The language has everything needed for rapid development. The language comes with support for the whole PHP ecosystem. It has testing and formatting integrated, and comes with a REPL in which one can quickly prototype functions. The only downside to the language at this point is its speed. I haven't done any concrete metrics, but when you visit the website you will feel the load times. I have talked with the language author and he knows about the issue and is working on a "compile" feature which will make the language as fast as PHP itself. Considering that the language is version 0.2.0, I can't wait for it to reach a stable release.
-
-## F# "review"
-
-Originally I have wanted my first F# project to be a backend project, like a simple API or something, but since I wanted to replace Javascript with something I gave F# a chance. I do not regret it. The language is very beautiful. It's syntax is similar to LISP at times. It's immutable but can be mutable, it's functional but can be object oriented, it's strongly typed but most of the times it feels like a dynamic language because of type inference, it's what almost every new language these days wants to be, but is actually around 10 years old. A gem. Writing F# is fun and different than writing JS. Most of the time I was in my code editor, "adjusting" types and making the compiler happy. I would open the browser just to verify that it works after evertyhing compiles. When in case of JS I would write a line of code and then refresh the page in the browser to make sure that it runs or that I gave the correct parameter to a function etc. Maybe this is why Typescript is so loved these days.
-
-
-
 ## TODO
 
-The code in `src/helpers.phel` should be somewhere else. Maybe in Phel (extract-data-from-request) or converted to a public function in mabasic/phel-json library (encode-value).
+- [ ] The code in `src/helpers.phel` should be somewhere else. Maybe in Phel (extract-data-from-request) or converted to a public function in mabasic/phel-json library (encode-value).
+- [ ] Upgrade to latest version of Phel. For some reason I am having problems with this atm.
 
 ## Requirements
 
 - PHP 8.1
 - Node.js v18.17.1
+- pnpm
 
 ## Quickstart
 
@@ -60,31 +22,45 @@ The code in `src/helpers.phel` should be somewhere else. Maybe in Phel (extract-
 composer install
 
 # node
-npm install
+pn install
 
 # Use this to compile the phel application to php.
 composer compile
 
-# (Recommended) This commands starts the watch processes for js and css and starts the php server.
-npm run all
+# dev mode
+PHEL_MODE=slow php -S localhost:8000 -t public/
 
-# Use this to only start the phel application.
-composer dev
+# prod mode
+composer compile && PHEL_MODE=fast php -S localhost:8000 -t public/
+```
+
+For managing SCSS:
+
+```bash
+# One time scss -> css.
+pn css-dev
+# Watch for changes.
+pn css-dev-watch
+# Compile for production.
+pn css-prod
+# Lint scss code.
+pn css-lint
 ```
 
 Run tests with:
 
 ```
 composer test
-npm run test
 ```
 
 ## Code Formatting
 
 ```bash
 vendor/bin/phel format src/
 vendor/bin/phel format tests/
+
 # or
+
 composer format
 ```
 
@@ -94,13 +70,20 @@ Compile PHEL to PHP.
 
 ```bash
 vendor/bin/phel compile --no-cache
+
 # or
+
 composer compile
+composer compile:no-cache
 ```
 
 verify that `index.php` has the right code uncommented (fast/slow).
 
-
-## Icons
+# Icons
 
 This project uses [bootstrap-icons](https://icons.getbootstrap.com/). The icons are copied (svg) one by one to `resources/svg/icons/*.svg`.
+
+## License and disclaimer
+
+This repository contains the source code for my personal website. The source code is publicly available for educational and informative purposes, but is given without any license because it contains my personal data and information. I do not grant any permissions for the source code except reading the source code for educational or informative purposes. I really wanted to keep the original development commit log, but I have accidentaly commited a license file at some point, which gave all permissions to my personal data. I know that there are ways of removing that one file from history, but it was much simpler to just create a new repository and copy the files over.
+
diff --git a/content/posts/2021-03-21-initial-commit.md b/content/posts/2021-03-21-initial-commit.md
@@ -0,0 +1,21 @@
+---
+title: "Initial Commit"
+author: "Mario Bašić"
+date: "2021-03-21"
+excerpt: "This blog post contains what was previously written in the README.md."
+---
+
+My initial idea was to use Phel on the backend and Rescript on the frontend. I tried to build the backend to match the previous website (n6) which was built with Laravel. Routing, global middleware, validation, logging, mail, CSRF protection, configs, partials and layouts are all inspired by Laravel. **It took me around 14 days to complete this website (3-6.3.2021 to 20-21.3.2021).** Since I spent a whole bunch of time implementing backend features, when I came to the point of dealing with Javascript I decided to stick to the already existing javascript code from the previous website, but with improvements to the tooling (prettier, eslint, webpack, babel, prop-types) and data handling. I still want to switch from Javascript to something else, but that will probably have to be in the future. Recently, I have started learning about F# and Fable/Feliz and that got me questioning using Rescript on the frontend. Also there are other options like Elm or Dart. ~~Can't really decide.~~ _Decided to go with F#/Fable. See update bellow for more details._
+
+## Phel-lang
+
+Working with Phel was very fun and an interesting mind flex. The concept that code is data is mind blowing. This is my first encounter with a lisp inspired language and a functional language. The language has everything needed for rapid development. The language comes with support for the whole PHP ecosystem. It has testing and formatting integrated, and comes with a REPL in which one can quickly prototype functions. The only downside to the language at this point is its speed. I haven't done any concrete metrics, but when you visit the website you will feel the load times. I have talked with the language author and he knows about the issue and is working on a "compile" feature which will make the language as fast as PHP itself. Considering that the language is version 0.2.0, I can't wait for it to reach a stable release.
+
+## F#/Fable
+
+Originally I have wanted my first F# project to be a backend project, like a simple API or something, but since I wanted to replace Javascript with something I gave F# a chance. I do not regret it. The language is very beautiful. It's syntax is similar to LISP at times. It's immutable but can be mutable, it's functional but can be object oriented, it's strongly typed but most of the times it feels like a dynamic language because of type inference, it's what almost every new language these days wants to be, but is actually around 10 years old. A gem. Writing F# is fun and different than writing JS. Most of the time I was in my code editor, "adjusting" types and making the compiler happy. I would open the browser just to verify that it works after evertyhing compiles. When in case of JS I would write a line of code and then refresh the page in the browser to make sure that it runs or that I gave the correct parameter to a function etc. Maybe this is why Typescript is so loved these days.
+
+## Future improvements
+
+In the future I plan on adding missing tests and replacing Javascript with something else. Initially, I have started with simple tests for pages and partials, but then I got busy with implementing features and finishing the website, so the tests fell behind.
+
diff --git a/content/posts/2021-04-27-update-fsharp-fable.md b/content/posts/2021-04-27-update-fsharp-fable.md
@@ -0,0 +1,12 @@
+---
+title: "Update: F#/Fable"
+author: "Mario Bašić"
+date: "2021-04-27"
+excerpt: "I've rewritten Javascript with F#/Fable."
+---
+
+I've rewritten Javascript with F#/Fable. After reading about F# and F#/Fable, comparing it with Rescript and Elm, and trying to find a project to experiment with it I have decided to use Fable and write Javascript with F#. My goal was to go all in and not write a single line of javascript. **It is all F# now 100%.** The code that I wrote follows the same structure as the JS code as much as possible. This was my plan so that it is easier for me to view differences. Parts of code could have been written better if I did not follow the code structure from JS as much.
+
+Since I was/am new to the language I had to figure out a lot of stuff including the tooling, the ecosystem, the syntax, the libraries. The documentation for Fable could be better. There are so many options for everything. I had to find a React library, a JSON library and figure out how to do HTTP requests. There were times where I almost gave up on the F#/Fable rewrite.
+
+~~For archive purposes I've kept the original JS files in the source code so that I can compare the syntax and code in the future.~~
diff --git a/content/posts/2021-05-24-update-new-blog.md b/content/posts/2021-05-24-update-new-blog.md
@@ -0,0 +1,8 @@
+---
+title: "Update: New Blog"
+author: "Mario Bašić"
+date: "2021-05-24"
+excerpt: "I've moved my blog from Gatsby.js to this website."
+---
+
+I've moved my blog from Gatsby.js to this website. In order to achive this I had to implement named route paramaters in the router, implement reading front matter/markdown from files and converting to html, implement better active route detection (laravelista/Ekko logic) and other related stuff. The whole process was simple, but I had to deal with regex and that was painful. Every time I have to lookup what each symbol means. I have added a bunch of tests and updated the application to Phel 0.3.2 which bring new data structures and fixes.
diff --git a/content/posts/2022-07-23-update-removed-webpack-and-fsharp-fable.md b/content/posts/2022-07-23-update-removed-webpack-and-fsharp-fable.md
@@ -0,0 +1,10 @@
+---
+title: "Update: Removed webpack and F#/Fable"
+author: "Mario Bašić"
+date: "2022-07-23"
+excerpt: "I used F# to build the contact form on the start page because I wanted to try F#."
+---
+
+I used F# to build the contact form on the start page because I wanted to try F#. Since then I have started using F# whenever I can. My goal is to make a simple contact form with no JS. Phel renders html form, form submits and the user gets the response as html. Because of that I am removing F# from this repository. I have made a new tag called `fsharp-fable-start` where you can view the last working version of F#/Fable start page form.
+
+Because of this I have moved away from webpack to using rollup for js and sass for css. I think that this is very simple now to maintain and there are no hacks involved.
diff --git a/content/posts/2023-08-27-changelog-2023-so-far.md b/content/posts/2023-08-27-changelog-2023-so-far.md
@@ -5,26 +5,3 @@ date: "2023-08-27"
 excerpt: "This post contains an overview of the things that have happened in the previous years since my last post, my current situation and my plans for the future."
 ---
 
-I have received an email from GitHub saying something about the "archive program" bla bla to push a commit to my repositories in order for them to be included in the program. I did not know anything about the program, what it is or what is its purpose, but eventually I opened the link and read this:
-
-<!-- > _"On February 2, 2020, GitHub will capture a snapshot of every active public repository, to be preserved in the GitHub Arctic Code Vault. This data will be stored on 3,500-foot film reels, provided and encoded by Piql, a Norwegian company that specializes in very-long-term data storage. The film technology relies on silver halides on polyester. This medium has a lifespan of 500 years as measured by the ISO; simulated aging tests indicate Piql’s film will last twice as long."_ -->
-
-<blockquote class="blockquote">
-  <p>"On February 2, 2020, GitHub will capture a snapshot of every active public repository, to be preserved in the GitHub Arctic Code Vault. This data will be stored on 3,500-foot film reels, provided and encoded by Piql, a Norwegian company that specializes in very-long-term data storage. The film technology relies on silver halides on polyester. This medium has a lifespan of 500 years as measured by the ISO; simulated aging tests indicate Piql’s film will last twice as long."</p>
-</blockquote>
-
-And then on the next paragraph it said:
-
-<!-- > _"The GitHub Archive Program is partnering with Microsoft’s Project Silica to ultimately archive all active public repositories for over 10,000 years, by writing them into quartz glass platters using a femtosecond laser."_ -->
-
-<blockquote class="blockquote">
-  <p>"The GitHub Archive Program is partnering with Microsoft’s Project Silica to ultimately archive all active public repositories for over 10,000 years, by writing them into quartz glass platters using a femtosecond laser."</p>
-</blockquote>
-
-This is a big deal! This means that the code I wrote (including this blog) will be preserved in the north pole for at least 500 years. Something like a timecapsule ... so I started thinking ... I could use this blog to write down something for my grand kids 500 years in the future. The purpose of the [GitHub archive program](https://archiveprogram.github.com/) is to preserve open source software for future generations, but I (like many others I suppose) have a far simpler idea:
-
-Since I don't believe that I will live long enough to see 100 generations of my grand kids, here is a picture of myself and my daughter Sofia. 
-
-> She is my next generation.
-
-The cold vault will be updated every five years, so in the meantime I can think of something better to write for the future...