Skip to content

Commit ad63853

Browse files
add authentication, add assets content
1 parent f48627a commit ad63853

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

45 files changed

+71964
-7
lines changed

.idea/laraveltuts.iml

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

.idea/php.xml

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

Tutorial.md

Lines changed: 177 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -749,4 +749,181 @@ Thats it. When we enter information in our form. Our Post should b added to the
749749

750750
Learn more about using models [here](https://laravel.com/docs/7.x/eloquent).
751751

752+
# Working with assets
752753

754+
When working with assets Laravel has a lot of options for us to choose from. But we will kepp it simple.
755+
Head to the public folder and create a file called `primary.css`.
756+
757+
Enter some css into it as shown below.
758+
759+
```css
760+
.header {
761+
font-size: 20px;
762+
color:darkblue;
763+
}
764+
765+
.subtitle {
766+
font-style: italic;
767+
text-underline: #1b1e21;
768+
font-weight: bold;
769+
}
770+
771+
```
772+
773+
Now we create a new route to test your style in.
774+
How route name is `dashboard/home`.
775+
776+
```php
777+
// web.php
778+
Route::get('/dashboard/home', 'DashboardController@home');
779+
```
780+
781+
Create our function
782+
783+
```php
784+
// DashboardController.php
785+
786+
public function home(){
787+
return View("dashboard.home");
788+
}
789+
```
790+
791+
Now we add our `primary.css` in our `home.blade.php` view.
792+
793+
794+
```html
795+
<!DOCTYPE html>
796+
<html lang="en">
797+
<head>
798+
<meta charset="UTF-8">
799+
<title>App Name</title>
800+
<link href="{{ asset('primary.css') }}" rel="stylesheet" />
801+
</head>
802+
<body>
803+
<div style="margin: 0 auto; border: 1px solid #ccc; padding:5px;">
804+
<h1 class="header">Welcome to the home page</h1>
805+
<p class="subtitle">This is the home page</p>
806+
</div>
807+
</body>
808+
</html>
809+
```
810+
811+
Of special mention is this link
812+
813+
```html
814+
<link href="{{ asset('primary.css') }}" rel="stylesheet" />
815+
```
816+
817+
This is how you add an external sytyle cheat. You can create a css folder if you want. Only the path will chnage
818+
819+
```html
820+
<link href="{{ asset('css/primary.css') }}" rel="stylesheet" />
821+
```
822+
823+
The results can be seen below. Our `header` and `subtitle` elements are shown with styling.
824+
825+
[adding_a_stylesheet.png]
826+
827+
## Adding javascript files
828+
829+
Lets try to add javascript files to our app.
830+
In our public folder we create the `main.js` file. We add the code below.
831+
832+
```javascript
833+
window.onload = function() {
834+
document.getElementById("Save").onclick = function fun() {
835+
alert("hello");
836+
837+
}
838+
}
839+
```
840+
841+
Next we create our view called `help.blade.php`.
842+
843+
```html
844+
<!DOCTYPE html>
845+
<html lang="en">
846+
<head>
847+
<meta charset="UTF-8">
848+
<title>App Name</title>
849+
<script type="text/javascript" src="{{ asset('main.js') }}"></script>
850+
</head>
851+
<body>
852+
<div style="margin: 0 auto; border: 1px solid #ccc; padding:5px;">
853+
<h1>Help Page</h1>
854+
<button id="Save">Button</button>
855+
</div>
856+
</body>
857+
</html>
858+
```
859+
860+
Notice we add our script using the same `asset` function.
861+
862+
Thats all we need we should be good to go. The results is shown below.s
863+
864+
[add_js_assets.gif]
865+
866+
867+
# User authentication
868+
869+
To get started with authentication we use Laravel suggested method.
870+
So we need to run some commands. Learn more [here](https://laravel.com/docs/7.x/authentication).
871+
872+
First we run some composer commands
873+
874+
```bash
875+
composer require laravel/ui
876+
877+
php artisan ui vue --auth
878+
```
879+
880+
Now if we didn't run `npm install` we do this now.
881+
882+
```bash
883+
npm install
884+
```
885+
886+
Then we run the `dev` scripts
887+
888+
```bash
889+
npm run dev
890+
```
891+
892+
Doing all of this adds authentication to our app. When we are complete run the app
893+
and head to `http://127.0.0.1:8000/login`. We will see an awesome login page.
894+
895+
[login_view.png]
896+
897+
## Creating a user
898+
899+
To create a new user lets head to the registration page. Via `http://127.0.0.1:8000/register`.
900+
Enter you new user information
901+
902+
[register_user.png]
903+
904+
Once thats complete we would have created a new user. Lets check the database to see it.
905+
906+
[user_in_database]
907+
908+
## Protected Routes
909+
910+
Lets protect a route. We will user the create a post route.
911+
912+
```php
913+
Route::match(['get', 'post'],'/dashboard/create', 'DashboardController@create')
914+
->middleware('auth');
915+
```
916+
917+
We attach the `auth` middleware to our function. This means you need to be logged in to access this route.
918+
919+
We can see this in action below.
920+
921+
[protecting_a_route.gif]
922+
923+
# Conclusion
924+
925+
Here ends our beginner introduction into the Laravel framework. There is alot more to dive into.
926+
But we will stop here for now. You should have the basics to get up and running. Be sure to check out
927+
the documents as they are pretty good and that's what I used to guide me.
928+
929+
There are alot more beginner tutorials on this site with awesome pictures. Be sure to check them out.
Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
<?php
2+
3+
namespace App\Http\Controllers\Auth;
4+
5+
use App\Http\Controllers\Controller;
6+
use App\Providers\RouteServiceProvider;
7+
use Illuminate\Foundation\Auth\ConfirmsPasswords;
8+
9+
class ConfirmPasswordController extends Controller
10+
{
11+
/*
12+
|--------------------------------------------------------------------------
13+
| Confirm Password Controller
14+
|--------------------------------------------------------------------------
15+
|
16+
| This controller is responsible for handling password confirmations and
17+
| uses a simple trait to include the behavior. You're free to explore
18+
| this trait and override any functions that require customization.
19+
|
20+
*/
21+
22+
use ConfirmsPasswords;
23+
24+
/**
25+
* Where to redirect users when the intended url fails.
26+
*
27+
* @var string
28+
*/
29+
protected $redirectTo = RouteServiceProvider::HOME;
30+
31+
/**
32+
* Create a new controller instance.
33+
*
34+
* @return void
35+
*/
36+
public function __construct()
37+
{
38+
$this->middleware('auth');
39+
}
40+
}
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<?php
2+
3+
namespace App\Http\Controllers\Auth;
4+
5+
use App\Http\Controllers\Controller;
6+
use Illuminate\Foundation\Auth\SendsPasswordResetEmails;
7+
8+
class ForgotPasswordController extends Controller
9+
{
10+
/*
11+
|--------------------------------------------------------------------------
12+
| Password Reset Controller
13+
|--------------------------------------------------------------------------
14+
|
15+
| This controller is responsible for handling password reset emails and
16+
| includes a trait which assists in sending these notifications from
17+
| your application to your users. Feel free to explore this trait.
18+
|
19+
*/
20+
21+
use SendsPasswordResetEmails;
22+
}
Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
<?php
2+
3+
namespace App\Http\Controllers\Auth;
4+
5+
use App\Http\Controllers\Controller;
6+
use App\Providers\RouteServiceProvider;
7+
use Illuminate\Foundation\Auth\AuthenticatesUsers;
8+
9+
class LoginController extends Controller
10+
{
11+
/*
12+
|--------------------------------------------------------------------------
13+
| Login Controller
14+
|--------------------------------------------------------------------------
15+
|
16+
| This controller handles authenticating users for the application and
17+
| redirecting them to your home screen. The controller uses a trait
18+
| to conveniently provide its functionality to your applications.
19+
|
20+
*/
21+
22+
use AuthenticatesUsers;
23+
24+
/**
25+
* Where to redirect users after login.
26+
*
27+
* @var string
28+
*/
29+
protected $redirectTo = RouteServiceProvider::HOME;
30+
31+
/**
32+
* Create a new controller instance.
33+
*
34+
* @return void
35+
*/
36+
public function __construct()
37+
{
38+
$this->middleware('guest')->except('logout');
39+
}
40+
}
Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
<?php
2+
3+
namespace App\Http\Controllers\Auth;
4+
5+
use App\Http\Controllers\Controller;
6+
use App\Providers\RouteServiceProvider;
7+
use App\User;
8+
use Illuminate\Foundation\Auth\RegistersUsers;
9+
use Illuminate\Support\Facades\Hash;
10+
use Illuminate\Support\Facades\Validator;
11+
12+
class RegisterController extends Controller
13+
{
14+
/*
15+
|--------------------------------------------------------------------------
16+
| Register Controller
17+
|--------------------------------------------------------------------------
18+
|
19+
| This controller handles the registration of new users as well as their
20+
| validation and creation. By default this controller uses a trait to
21+
| provide this functionality without requiring any additional code.
22+
|
23+
*/
24+
25+
use RegistersUsers;
26+
27+
/**
28+
* Where to redirect users after registration.
29+
*
30+
* @var string
31+
*/
32+
protected $redirectTo = RouteServiceProvider::HOME;
33+
34+
/**
35+
* Create a new controller instance.
36+
*
37+
* @return void
38+
*/
39+
public function __construct()
40+
{
41+
$this->middleware('guest');
42+
}
43+
44+
/**
45+
* Get a validator for an incoming registration request.
46+
*
47+
* @param array $data
48+
* @return \Illuminate\Contracts\Validation\Validator
49+
*/
50+
protected function validator(array $data)
51+
{
52+
return Validator::make($data, [
53+
'name' => ['required', 'string', 'max:255'],
54+
'email' => ['required', 'string', 'email', 'max:255', 'unique:users'],
55+
'password' => ['required', 'string', 'min:8', 'confirmed'],
56+
]);
57+
}
58+
59+
/**
60+
* Create a new user instance after a valid registration.
61+
*
62+
* @param array $data
63+
* @return \App\User
64+
*/
65+
protected function create(array $data)
66+
{
67+
return User::create([
68+
'name' => $data['name'],
69+
'email' => $data['email'],
70+
'password' => Hash::make($data['password']),
71+
]);
72+
}
73+
}

0 commit comments

Comments
 (0)