Computer Engineer

 Axios en kısa tabiriyle front-end tarafından kendi Api mızdan yada başka bir Restful api dan veri çekmemize yarar.  Şimdi  https://rallycoding.herokuapp.com/api/music_albums adresinden veri çekelim.  https://jsonplaceholder.typicode.com/ sizde burada çekebilirsiniz. Buradan title, artist ve image propertilerini çekeceğim boostrap ile güzel bir card section yapıp burada göstereceğim.  React projenizi setup ettiğinizi düşünüyorum.   Yeni bir component oluşturur iken class base component oluşturmamız gerekiyor. Çünkü componentDidMounth methodu ile render methodumuzdan önce verilerimizi getireceğiz. Life cycle methodlarıda method base componentlerde kullanılmaz. npm i axios komutu ile projemin olduğu dizine axios kütüphanesini de dahil ediyorum. Componentimi şimdilik yazımı bu şekilde. Clasik boostrap card kullandım. Ben projeme boostrap css kullandım. Nasıl Kullanacağı blogun içinde mevcutbakabilirsiniz. Şimdi bu componentimin...

import React , { Component } from 'react' ; import TodoApp from './educate/Todo/TodoApp' ; class App extends Component { render () { return ( < div className = "container" > < header className = "App-header" > < h1 className = "App-title" > Welcome to React </ h1 > </ header > < p className = "App-intro" > To get started, edit < code > src/App.js </ code > and save to reload. </ p > < TodoApp /> </ div > ); } } export default App ; aaa import React , { Component } from 'react' ; import Todos from "./Todos" ; import AddTodo from './addTodo' class TodoApp extends Component { state = { todos : [ { id : 1 , container : 'Finish React Tutorial' }, { id : 2 , container : 'Start React with Firebase' }, { id : 3 , container : 'React wit NodeJs and ...