You are defining three times the same route, it can't work.
Route::get('/about', function() { return view('pages.about'); }); //jobs page
Route::get('about', [SkillsController::class,'showSkills']); // skills component
Route::get('about', [JobsController::class,'showJobs']); // jobs component
Be aware of something important : one route / one controller / one action. You can't hope that one route will execute two different actions in two different controllers.
If you want to display the skills and the jobs on the same page, for example the about page, you should create a dedicated controller to display this page. And pass the skills and the jobs to the view.
class AboutController extends Controller
{
public function get()
{
$skills = Skill::all();
$jobs = Job::all();
return view('pages.about', compact('skills', 'jobs'));
}
}
Then the route would be like this.
Route::get('about', [AboutController::class, 'get']);
Furthermore you are using components like simple fragments of code. If you want to use components, you should also call the components like mentioned in the documentation.
<x-skills></x-skills>
<x-jobs></x-jobs>
https://laravel.com/docs/10.x/blade#rendering-components
You can also use blade fragments if it's that's you really need.
https://laravel.com/docs/10.x/blade#rendering-blade-fragments
But components and fragments are different approaches of using blade to add a portion of HTML code according to what you really need.
Seeing your code, I suggest you to follow some tutorial, for example Laravel from scratch.
