laravelmarksnotes


This is the Laravel Version of Marked Notes


https://firebasestorage.googleapis.com/v0/b/alonzoaustin-8314b.appspot.com/o/7_4_21%2Flaravel_marks_notes%2Fmain.png?alt=media&token=3743c8be-f8c4-4ae3-98ca-d3e27bf25ba0https://firebasestorage.googleapis.com/v0/b/alonzoaustin-8314b.appspot.com/o/7_4_21%2Flaravel_marks_notes%2Fcreate.png?alt=media&token=bfcfcd32-3960-4580-8057-a9cc7a3c81achttps://firebasestorage.googleapis.com/v0/b/alonzoaustin-8314b.appspot.com/o/7_4_21%2Flaravel_marks_notes%2Fnote.png?alt=media&token=ad45bde3-cc4e-4fec-a3a4-9e8ff0a7972fhttps://firebasestorage.googleapis.com/v0/b/alonzoaustin-8314b.appspot.com/o/7_4_21%2Flaravel_marks_notes%2Fmain-mobile.png?alt=media&token=10e2013e-9ce3-4b73-bdd5-0b9e2f2bd4dfhttps://firebasestorage.googleapis.com/v0/b/alonzoaustin-8314b.appspot.com/o/7_4_21%2Flaravel_marks_notes%2Fcreate-mobile.png?alt=media&token=e78ad086-78b2-4105-9bda-e2524c0ab38ahttps://firebasestorage.googleapis.com/v0/b/alonzoaustin-8314b.appspot.com/o/7_4_21%2Flaravel_marks_notes%2Fnote-mobile.png?alt=media&token=7a53712e-b4a5-448d-a69e-99c2d8bc4b01

After creating many projects in a Javascript bubble, I decided to learn something new: PHP. After taking a Codecademy course on PHP and watching a few videos on Laravel, I decided to learn Laravel and PHP by recreating Markednotes.

Getting Started with PHP and Laravel

Because the standard method of installing PHP on Windows is complex, I decided to install PHP and Composer in a way similar to Linux package managers by using Chocolatey. When I tried to create a new Laravel Project using Composer, I got an error indicating that I was missing some extensions. I solved this by going into C:\tools\php80 and by uncommenting the extensions in php.ini. After that, I was able to get started on creating the web app.

Auth0

Because I wanted to make sure that users can use both Markednotes and the Laravel version, I decided to use Auth0 for authentication. Implementing this was a learning curve for me because I was coming from a Javascript background and jumping into using Laravel without building anything with PHP. Thankfully, Auth0 made it easy for me with their guide. Because this was merely a port of markednotes-a project I made using NextJS-the only thing I had to do besides following the guide was copy and paste my environment variables from markednotes to this project add the callback and logout URLs.

By implementing Auth0, I was able to get an understanding of how controllers work. This came in handy when I implemented MongoDB.

MongoDB

Like Auth0, MongoDB has a guide The only thing I had to do on my own was to create a function that would allow users to read all of their notes when signed-in, allowing users to create notes on their account and making sure that users can edit/update their notes.

reading user's notes

Instead of using the NoteController, I decided to put the function in the Auth0IndexController so that as soon as a user signs in goes to the main page, the user's notes would appear. This is because the user's information is tied to each note to identify who owns the note. It looked like this:


    public function profile()
    {
        if (!Auth::check()) {
            return redirect()->intended('/info');
        }

        return view('/welcome')->with([
            'user' => print_r(Auth::user()->getUserInfo()["email"], true),
            'notes' => Note::where("user", "=", Auth::user()->getUserInfo()["email"])->get(),
            /* print_r(Auth::user(), true) */
        ]);
    }

I did something similar for the create view so that the user property would be posted when the user creates the note.


    public function allowCreation(){
        if (!Auth::check()) {
            return redirect()->route('login');
        }

        return view('/create')->with([
            'user' => print_r(Auth::user()->getUserInfo()["email"], true)
        ]);
    }

Because PUT is not a native method for form elements in HTML, Laravel provides a method to tell the form that it is a PUT method rather than a POST method. To do this, I needed to make sure that in the form element, the method attribute had to be POST while under the form element, @method("PUT") had to be added. It looked like this:


    <form id="createCard" action="/api/notes/{{ $note->_id }}" method="post">
        @method("PUT")

After implementing MongoDB, I was able to finish my project.