DEV Community

Arif Iqbal
Arif Iqbal

Posted on

Week 2 of 100DaysOfCode Laravel Challenge

Episode 11: Use the Filesystem Class to Read a Directory

  • In this episode, we create a Post model class and move the post finding code from the route definition to the Mode class method find(). We add another method all() to this class where we fetch all posts from the resource/posts directory. We use the Laravel File Facades Illuminate\Support\Facades\File fetch all the files from a directory into an array.

Contributed to the Blog project:

Before:

Route::get('/posts/{post}', function ($slug) {
    $path = __DIR__."/../resources/posts/{$slug}.html";

    if(! file_exists($path)) {
        abort(404);
    }

    $post = cache()->remember('posts'.$slug, 1200, fn() => file_get_contents($path));

    return view('post', [
        'post' => $post
    ]);
})->where('post', '[a-z\-]+');
Enter fullscreen mode Exit fullscreen mode

After:

Route::get('/posts/{post}', function ($slug) {
    return view('post', [
        'post' => Post::find($slug)
    ]);
})->where('post', '[a-z\-]+');
Enter fullscreen mode Exit fullscreen mode

Episode 12: Find a Composer Package for Post Metadata

In this episode, we find a composer package that can parse metadata added to our blog posts in the following format:

---
title: "My First Post"
slug: my-first-post
excerpt: Lorem Ipsum is simply dummy text of the printing and typesetting industry.
date: 2021-12-01
---
Enter fullscreen mode Exit fullscreen mode

This metadata format has name called Yaml Frontmatter. So, we searched a composer package for it and found this one "spatie/yaml-front-matter": "^2.0" and installed it. We can use this to parse a file like this:

$document = \Spatie\YamlFrontMatter\YamlFrontMatter::parseFile($file_path);
Enter fullscreen mode Exit fullscreen mode

And then access the post metadata as:

$title = $document->title;
$body = $document->body();
Enter fullscreen mode Exit fullscreen mode

Contributed to the Blog project:


Episode 13: Collection Sorting and Caching Refresher

We have a date field in our post metadata but we are not sorting our posts based on that field. As we are using Laravel Collections for listing our blog posts, we can use collection methods like sortBy() to sort our posts by the published date.

  • Sort blog posts by the published date in descending order collect(SOME_ARRAY)->sortBy(FIELD_NAME)
  • User Laravel tinker php artisan tinker >>
  • tinker>> cache(KEY_NAME) will print the cached content
  • tinker>> cache()->forget(KEY_NAME) will clear the cache for the specified key
  • tinker>> cache(KEY_NAME) is same as tinker>> cache()->get(KEY_NAME)
  • tinker>> cache(['KEY' => val]) is same as tinker>> cache()->put('KEY', val)
  • tinker>> cache(['KEY' => val], now()->addSeconds(3)) will cache and remember the key for three seconds

  • Contributed to the Blog project

  • Tweet

Episode 14: Blade: The Absolute Basics

The blade is Laravel templating engine used for views. You can think of it as a layer on top of PHP that makes common operations easier. Ultimately, your blade files are compiled down to vanilla PHP. The compiled files are saved in storage/framework/views directory.

Blade files are saved with the extension .blade.php. If you omit the .blade extension, your PHP code will be still executed but your blade syntax will be not resolved.

Some common Blade syntax examples:

  • {{ $title }} is identical to <?PHP echo $title; ?>
@foreach($posts as $post)
{{ $post->title }}
@endforeach
Enter fullscreen mode Exit fullscreen mode

is identical to

<?php
foreach($posts as $post):
echo $post->title;
endforeach;
?>
Enter fullscreen mode Exit fullscreen mode
  • @if() ... @endif block
  • {{ $post->body }} will escape the p tags or any other HTML. You can prevent this by this syntax {!! $post->body !!} but be careful and not use this with user supplied input like form submissions.

  • @unless, @dd, and the $loop variable

  • the $loop variable gives us information about the current iteration of the loop:

{#295 ▼
  +"iteration": 1
  +"index": 0
  +"remaining": 4
  +"count": 5
  +"first": true
  +"last": false
  +"odd": true
  +"even": false
  +"depth": 1
  +"parent": null
}
Enter fullscreen mode Exit fullscreen mode

Thank you for following along with me. Any suggestions/advice for improvement will be appreciated.

~ Happy Coding

Discussion (0)