Documentation

Job Portal

Job portal is a website and is known as a bridge between an organization and job seekers. Job Portal serves jobseekers to find available job vacancies and Employers to identify eligible job seekers with the prospect of selecting the most qualified candidates.

Folder Hierarchy

In JobPortal_11-Nov-22 Folder, we have 2 folders for Frontend and Backend code. Frontend folder contains all Frontend Code while Backend contains all Backend Code as well as SQL file.

Frontend

React JS

React, sometimes referred to as a frontend JavaScript framework, is a JavaScript library created by Facebook.

ReactJS is a declarative, efficient, and flexible library for building reusable UI components.

A ReactJS application is made up of multiple components, each component responsible for outputting a small, reusable piece of HTML code.

Installation

Follow the steps below to setup your site template:

1. Unzip the downloaded package and It Contains:
• fronend - Contains all Frontend
2. Follow steps here to install and configure technologies. If you already installed and configured then skip this step
3. To install dependencies of project
• fronend
  
  

  cd job-portal/frontend
  npm i
  npm start

4. You are good to go for customizing this web app now!

Frontend Structure

Dashboard follows a simple and easy to customize coding structure. Here is the files/folders structure looks like:

• public - Contains index.html and some static files
• src - Contains all files related to react app, or you can say root directory of app
  • assets - Contains all static files and other assets of app
  • Components - Contains all main components/pages of candidate
  • Employee - Contains all main components/pages of employee
  • Admin - Contains all main components/pages of admin
  • Redux - Contains all files related to redux
  • axios-config.js - It is file which contains navigate to login in case of user credentials are require
  • index.js - It is main file which serves App.js to public/index.html
• package.json - It is file contains all information of backend like dependencies, versions, scripts, etc.

If you need more information, please visit source

Backend

Laravel

Laravel is an open-source PHP framework that uses the MVC architecture..

• Framework - It is the collection of methods, classes, or files that the programmer uses, and they can also extend its functionality by using their code.
• Architecture - It is the specific design pattern that the framework follows. Laravel is following the MVC architecture.

MVC is divided into three letters shown below:

• M - 'M' stands for Model. A model is a class that deals with a database.
• V - 'V' stands for View. A view is a class that deals with an HTML.
• C - 'C' stands for Controller. A controller is the middle-man that deals with both model and view.

Installation

Follow the steps below to setup your site template:

1. Unzip the downloaded package and It Contains:
• backend - Contains all Backend
2. Follow steps here to install and configure technologies. If you already installed and configured then skip this step
3. To install dependencies of project
• backend
  
  

  cd job-portal/backend
  php artisan serve

4. You are good to go for customizing this web app now!

Backend Structure

Dashboard follows a simple and easy to customize coding structure. Here is the files/folders structure looks like:

• connections - Contains all connections configration files
• functions - Contains all files related to basic/repeated/global functions
• models - Contains all models/structure of database
• routes - Contains all different routes of backend and all connected in main index.js
• static - Contains all static files or data for initialization for database
• index.js - It is main file which serves backend
• package.json - It is file contains all information of backend like dependencies, versions, scripts, etc.

If you need more information, please visit source

Pre Requisite

These are Pre requisite installation and configration

Frontend

Node JS

It has very easy step of installation

Various ways to install Node JS

• It is highly prefelable if you install through NVM Manger
• Visit Node Home Page, It will give you show you node js which is suitable fot your system.
• If you want download different latest node js visit Download Page
• If you want install directly through any package manager visit here
• If you want install sepcific version visit here

Highly Recommend install minimum v14.x node

Backend

PHP

PHP is an acronym for "PHP: Hypertext Preprocessor". PHP is an open-source, interpreted, and object-oriented scripting language that can be executed at the server-side.

To install PHP, we will suggest you to install AMP (Apache, MySQL, PHP) software stack. It is available for all operating systems. There are many AMP options available in the market that are given below:

• WAMP for Windows - visit here for downloading WAMP
• LAMP for Linux - visit here for downloading LAMP
• MAMP for Mac - visit here for downloading MAMP
• XAMPP (Cross, Apache, MySQL, PHP, Perl) for Cross Platform: It includes some other components too such as FileZilla, OpenSSL, Webalizer, Mercury Mail, etc. - visit here for downloading XAMPP

Composer

Composer is a dependency manager for a PHP programming language that manages the dependencies of PHP software and required libraries.

Composer runs through the command line. The main purpose of the composer is to install the dependencies or libraries for an application. The composer also provides the users to install the PHP applications available on the Packagist, where Packagist is the main repository that contains all the available packages.

Composer provides autoloading capabilities for libraries to ease the usage of third-party code.

Visit here for downloading Composer

Laravel

Laravel is an open-source PHP framework that uses the MVC architecture.. It also offers the rich set of functionalities that incorporates the basic features of PHP frameworks such as Codelgniter, Yii, and other programming languages like Ruby on Rails.

There are two way we can install Laravel

• Via Laravel Installer
• Via Composer Create-Project

Via Laravel Installer

• download the Laravel installer using Composer:
  composer global require laravel/installer
• Once installed, the laravel new command will create a fresh Laravel installation in the directory you specify.

Via Composer Create-Project

• Alternatively, you may also install Laravel by issuing the Composer create-project command in your terminal:
  composer create-project --prefer-dist laravel/laravel:^7.0 blog

Local Development Server

This command will start a development server at http://localhost:8000:

php artisan serve

MySQL

MySQL is a relational database management system based on the Structured Query Language, which is the popular language for accessing and managing the records in the database. MySQL is open-source and free software under the GNU license. It is supported by Oracle Company.

• Download MySQL for your OS

Configration

Backend Configration required before running this web application

For connecting databse in API project, you have to define few variables in .env file:

For running API, run the below command in your project terminal.:

php artisan serve

Design & Customization

These are Design & Customization, Related to this Web Appication

CSS

We have include a Custom CSS File in the assets/css Folder so that you can better handle your Customizations for New Styles or Overwriting Default Theme Styles. Simply add all your Custom CSS Codes in the assets/css/main.css File and link it in the Document <head>. Also make sure that this is the Last Linked CSS File in the Document <head> so that your Custom CSS Styles are Overwritten properly.

Color Schemes

• #2042e3 - Primary Color - Blue
• #2042e31c - Light Blue Color
• #081828 - Text Color

Logo Settings

The Logo Container can be found in the Header Container - <header>

  <div style={{ display: "flex", alignItems: "center"}}>
  <div style={{ 
    display: "flex",
    alignItems: "center",
    justifyContent: "center",
    backgroundColor: "#2042e3",
    borderTopLeftRadius: 8,
    borderBottomLeftRadius: 8,
    borderBottomRightRadius: 40,
    borderTopRightRadius: 0,
    width: 100,
    height: 40
  }}>
    <h4 style={{ 
      color: "#fff",
      textAlign: "center",
      marginTop: "8px"
    }}>
      {"Job"}
    </h4>
  </div>
  <div style={{ 
    alignItems: "center",
    justifyContent: "center",
    backgroundColor: "#000",
    borderTopLeftRadius: 40,
    borderBottomLeftRadius: 0,
    borderTopRightRadius: 8,
    borderBottomRightRadius: 8,
    width: 120,
    height: 40
  }}>
    <h4 style={{ 
      color: "#fff",
      textAlign: "center",
      marginTop: "10px"
    }}>
      {"Portal"}
    </h4>
  </div>
</div>
  

Layout

Documentation and examples for Header, Footer

Header

The list of various header types & its descriptions are provided below for your reference:

Desktop

Mobile

Footer

The list of various footer types & its descriptions are provided below for your reference:

Desktop

Mobile

Candidate Job List

Desktop

Mobile

Company Job List

Backend

This Backend uses Laravel to connect ReactJS and MySQL

Routes

There are may routes in the project. This is Job routes:

Route::group(['prefix' => 'job', 'as' => 'job.'], function () {    
  Route::post('', [JobController::class, 'addJob'])->name('add');
  Route::get('', [JobController::class, 'getAllJobs'])->name('all');
  Route::get('/{job_id}', [JobController::class, 'getJobDetails'])->name('details')->whereNumber('job_id');
  Route::patch('/{job_id}', [JobController::class, 'editJob'])->name('edit-details')->whereNumber('job_id');
})   

Controller

Job controller:

   public function addJob(Request $request, Job $jobs)
    {
        auth()->shouldUse('api-employers');
        if (!auth()->user()) {
            $resObj = [
                'status' => 'error',
                'code' => Response::HTTP_UNAUTHORIZED,
                'message' => 'Not authorized to access this resource',
            ];
            return response()->json($resObj, $resObj['code']);
        }
        $resObj = (new CommonController)->exceptionHandler(function ($request) {
            $validator = Validator::make($request->all(), [
                'company_id' => 'required|numeric',
                'title' => 'required|string',
                'type' => 'required|integer',
                'category' => 'required|integer',
                'skill' => 'array',
                'gender' => 'in:0,1,2',
                'expiry_date' => 'date',
                'salary_from' => 'required|numeric',
                'salary_to' => 'required|numeric',
                'currency' => 'numeric',
                'salary_period' => 'numeric',
                'career_level' => 'numeric',
                'shift' => 'numeric',
                'tag' => 'numeric',
                'degree_level' => 'numeric',
                'functional_area' => 'integer',
                'position' => 'numeric',
                'experience' => 'numeric',
                'description' => 'string',
                'Recruiter_name' => 'string',
                'Recruiter_email' => 'string',
                'vacancy'=>'numeric',
            ]);

            if ($validator->fails()) {
                return $this->generateResponseObj(
                    'error',
                    Response::HTTP_BAD_REQUEST,
                    $validator->errors()->first()
                );
            }
            $job = Job::create($validator->validated());
            $users = Candidate::where('candidates.functional_area', '=', $job->functional_area)
                ->select('candidates.*')
                ->orderBy('id', 'desc')
                ->get();
            Notification::send($users, new jobnotification($job));
            return $this->generateResponseObj(
                'success',
                Response::HTTP_CREATED,
                'Job created successfully',
                ['job' => $job]
            );
        }, $request);
        return response()->json($resObj, $resObj['code']);
    }
  
    public function getAllJobs(Request $request)
    {
        $page_size = $request->page_size ?? 5;
        $candidate_id = auth('api-candidates')->id();
            $jobs = Job::orderBy('created_at', 'desc')
            ->where('expiry_date','>',carbon::now())
            ->select(
                'jobs.*',
            )->paginate($page_size);
            if($candidate_id !== null){
                foreach ($jobs as $job) {
                    $data = Bookmarks::where('job_id',$job['id'])->where('candidate_id',$candidate_id)->get()->toArray();
                    $bookmarkJob1 = (bool) $data;
                    $job['isbookmarkJob'] = $bookmarkJob1;  
                }
            }           
        return JobResource::collection($jobs);
    }
  
    public function getJobDetails(Request $request, $job_id)
    {
        $resObj = (new CommonController)->exceptionHandler(function ($job_id) {
            $job = Job::where('jobs.id', $job_id)
                ->select(
                    'jobs.*'
                )->get()->toArray();
            if (!$job) {
                return (new CommonController)->generateResponseObj(
                    'error',
                    Response::HTTP_NOT_FOUND,
                    'Job details not found'
                );
            }
            return (new CommonController)->generateResponseObj(
                'success',
                Response::HTTP_OK,
                'Job details found',
                ['job' => $job]
            );
        }, $job_id);
        return response()->json($resObj, $resObj['code']);
    }
  
    public function editJob(Request $request, $job_id)
    {
        $resObj = (new CommonController)->exceptionHandler(function ($request, $job_id) {
            $validator = Validator::make($request->all(), [
                'title' => 'string',
                'type' => 'integer',
                'category' => 'integer',
                'skill' => 'array',
                'gender' => 'in:0,1,2',
                'salary_from' => 'numeric',
                'salary_to' => 'numeric',
                'currency' => 'numeric',
                'salary_period' => 'numeric',
                'country' => 'numeric',
                'state' => 'numeric',
                'city' => 'numeric',
                'career_level' => 'numeric',
                'shift' => 'numeric',
                'degree_level' => 'numeric',
                'functional_area' => 'integer',
                'position' => 'numeric',
                'experience' => 'numeric',
                'description' => 'string',
                'Recruiter_name' => 'string',
                'Recruiter_email' => 'string',
                'vacancy'=>'numeric',
            ]);
            if ($validator->fails()) {
                return $this->generateResponseObj(
                    'error',
                    Response::HTTP_NOT_ACCEPTABLE,
                    $validator->errors()->first()
                );
            }
            $job = Job::findOrFail($job_id);

            $job->title = $request->title ? $request->title : $job->title;
            $job->type = $request->type ? $request->type : $job->type;
            $job->category = $request->category ? $request->category : $job->category;
            $job->skill = $request->skill ? $request->skill : $job->skill;
            $job->gender = is_null($request->gender) ? $job->gender : $request->gender;
            $job->expiry_date = $request->expiry_date ? $request->expiry_date : $job->expiry_date;
            $job->salary_from = $request->salary_from ? $request->salary_from : $job->salary_from;
            $job->salary_to = $request->salary_to ? $request->salary_to : $job->salary_to;
            $job->currency = $request->currency ? $request->currency : $job->currency;
            $job->salary_period = $request->salary_period ? $request->salary_period : $job->salary_period;
            $job->country = $request->country ? $request->country : $job->country;
            $job->state = $request->state ? $request->state : $job->state;
            $job->city = $request->city ? $request->city : $job->city;
            $job->career_level = $request->career_level ? $request->career_level : $job->career_level;
            $job->shift = $request->shift ? $request->shift : $job->shift;
            $job->tag = $request->tag ? $request->tag : $job->tag;
            $job->degree_level = $request->degree_level ? $request->degree_level : $job->degree_level;
            $job->functional_area = $request->functional_area ? $request->functional_area : $job->functional_area;
            $job->position = $request->position ? $request->position : $job->position;
            $job->experience = $request->experience ? $request->experience : $job->experience;
            $job->description = $request->description ? $request->description : $job->description;
            $job->Recruiter_name = $request->Recruiter_name ? $request->Recruiter_name : $job->Recruiter_name;
            $job->Recruiter_email = $request->Recruiter_email ? $request->Recruiter_email : $job->Recruiter_email;
            $job->vacancy = $request->vacancy ? $request->vacancy : $job->vacancy;

            $job->save();

            return $this->generateResponseObj(
                'success',
                 Response::HTTP_OK,
                  'job Profile Detail updated!!'
            );
        }, $request, $job_id);
        return response()->json($resObj, $resObj['code']);
    }

Source & Credits

Main

• MySQL - https://www.mysql.com/
• Laravel - https://laravel.com/
• ReactJS - https://reactjs.org
• React Redux - https://react-redux.js.org/

Other

• VSCode Editor - https://code.visualstudio.com
• Icons Font Face - https://fontawesome.com/

Minor

• Axios - https://github.com/axios/axios/blob/main/README.md
• Date Fns - https://github.com/date-fns/date-fns/blob/master/README.md
• Redux toolkit - https://github.com/reduxjs/redux-toolkit/blob/master/packages/toolkit/README.md

Support

If this documentation doesn't answer your questions, So, Please send us Email via dotnetexpert27@gmail.com

We answer all questions within 12-24 hours in weekdays. In some rare cases the waiting time can be to 48 hours. (except holiday seasons which might take longer).

Changelog

See what's new added, changed, fixed, improved or updated in the latest versions.

Version 1.0 (10 November, 2022)

Initial Release