question react component oluşturmak ve kullanmak

1. // @author kupanintorunu | 11 Kasım 2020

   Merhaba,

   Öncelikle bir js dosyası içinde componentimizi oluşturuyoruz.

   //react i import ediyoruz.
   import React,{Component} from "react";
   
   //classımızı belirliyoruz. Mutlaka baş harf büyük olacak
   //reactten componenti extend ediyoruz
   class NewsComponent extends Component{
   
       render(){
           return(
   //herşey tek bir div içersinde olacak. yani bu div in içinde istediğinizi ekleyebilirsiniz.
               <div>
                   <h1>Hello React</h1>
                   <p>İzmir'de son dakika haberi... Rıza Bey Apartmanı'nda 3 yaşındaki Ayda Gezgin bebek, 91'inci saatte canlı olarak enkaz altından çıkarıldı. Ayda bebeğe ilk müdahale olay yerinde yapıldı. Sağlık Bakanı Yardımcısı Prof. Muhammet Güven, Ayda'nın sağlık durumuna ilişkin olarak, "Genel olarak problem gözükmüyor. Şuuru açık, konuşabiliyor" dedi. Ayda bebeğin annesi Fidan Gezgin'in cansız bedenine ulaşıldı.</p>
               </div>
           )
       }
   
   }
   //burda da oluşturugumuz componenti dışarı aktarıyoruz.
   export default NewsComponent;

    

   Daha sonra bu componenti app.js dosyası içine import ediyoruz.

   import logo from './logo.svg';
   import './App.css';
   //burada componentimizi import ediyoruz.
   import NewsComponent from "./NewsComponent.js";
   
   function App() {
     return (
       <div className="App">
         <header className="App-header">
           <img src={logo} className="App-logo" alt="logo" />
   //burada componentimizi ekliyoruz 
         <NewsComponent></NewsComponent>
         </header>
       </div>
     );
   }
   
   export default App;

    

    

// Comments are closed.