DeveloperBreeze

Full-Stack Development Development Tutorials, Guides & Insights

Unlock 1+ expert-curated full-stack development tutorials, real-world code snippets, and modern dev strategies. From fundamentals to advanced topics, boost your full-stack development skills on DeveloperBreeze.

Integrating Laravel and React with Vite: Using Databases and PHP in a Full-Stack Project

Tutorial August 14, 2024
javascript php 

   function CreatePost() {
       const [title, setTitle] = useState('');
       const [body, setBody] = useState('');

       const handleSubmit = (event) => {
           event.preventDefault();

           axios.post('/api/posts', { title, body })
               .then(response => {
                   console.log('Post created:', response.data);
               })
               .catch(error => {
                   console.error('There was an error creating the post!', error);
               });
       };

       return (
           <form onSubmit={handleSubmit}>
               <div>
                   <label>Title:</label>
                   <input type="text" value={title} onChange={(e) => setTitle(e.target.value)} />
               </div>
               <div>
                   <label>Body:</label>
                   <textarea value={body} onChange={(e) => setBody(e.target.value)}></textarea>
               </div>
               <button type="submit">Create Post</button>
           </form>
       );
   }

   export default CreatePost;

For applications requiring authentication, Laravel offers built-in tools like Sanctum or Jetstream. You can protect API routes and access them from React using tokens or cookies.

Read More