Posts

Star rating system with html and css

 HTML file: Note: [ A Fontawesome kit is required.] <! DOCTYPE html > < html lang = "en" > < head >   < title > Star rating with HTML & CSS </ title >   < script src = "https://kit.fontawesome.com/abs123.js" crossorigin = "anonymous" ></ script > </ head > < body >   < div class = "rating-css" >     < div class = "star-icon" >       < input type = "radio" value = "1" name = "product_rating" checked id = "rating1" >       < label for = "rating1" class = "fa fa-star" ></ label >       < input type = "radio" value = "2" name = "product_rating" id = "rating2" >       < label for = "rating2" class = "fa fa-star" ></ label >       < input type = "radio" value = "3" name = ...

Laravel 9 React js CRUD

Laravel 9 React installation with Laravel Breeze: laravel  new  project-name cd  project-name composer require laravel/breeze --dev php artisan  breeze:install  react npm  install npm  run dev CRUD Operation: php artisan make:model Post -mcr database/migrations/2022_07_13_115218_create_posts_table.php <?php   use Illuminate\Database\Migrations\ Migration ; use Illuminate\Database\Schema\ Blueprint ; use Illuminate\Support\Facades\ Schema ;   return new class extends Migration {     /**      * Run the migrations.      *      * @return void      */     public function up ()     {         Schema :: create ( 'posts' , function ( Blueprint $table ) {             $table -> id ();             $table -> string ( 'title' );         ...

React

React: npx create-react-app my-react-app cd my-react-app npm start How to create the route in React js: npm latest version:  npm install -g npm@latest npm i react-router-dom Folder structure: Within the src folder, we'll create a folder named components with several files:  Home.js Blogs.js Contact.js      In index.js add the below line: import { BrowserRouter } from 'react-router-dom' ; const root = ReactDOM . createRoot ( document . getElementById ( 'root' )); root . render (   < React.StrictMode >     < BrowserRouter >       < App />     </ BrowserRouter >   </ React.StrictMode > );         In  App.js  paste this code: import { Routes , Route } from 'react-router-dom' import Home from './components/Home' import Blog from './components/Blog' import Contact from './components/Contact' function App () {     return ( ...