Go 言語と React で考える「いい感じなURL設計」入門

Go 言語と React で考える「いい感じなURL設計」入門

1. 1. 

2. 2. 

3. 3. 

4. 4. 
 
 

5. 5. 
 

6. 6. 
 
 

7. 7. 

8. 8. 
 
 

9. 9. 
 
 

10. 10. 
 
 
 

11. 11. 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

12. 12. 
 
 

13. 13. 
 
 

14. 14. 

15. 15. 
 

16. 16. interface FooterProps {
 company:string
 }
 
 export class FooterComponent extends React.Component<FooterProps, any> {
 
 constructor(props:FooterProps) {
 super(props)
 } // Props Build Error // <FooterComponent /> <FooterComponent company="eurie Inc." />
17. 17. export class MemberComponent extends React.Component<MemberProps, MemberState> {
 constructor(props:MemberProps) {
 super(props);
 this.state = {
 member: {}
 }
 };
 
 componentDidMount() {
 client().get("/members/" + this.props.params.number)
 .then(response => {
 this.setState({member: response.data})
 })
 .catch(response => {
 console.log(response)
 })
 };
 
 render() {
 let member = this.state.member;
 return <div id="member-component">
 <h3>{member.name} : {member.number}</h3>
 <p>{member.createdAt}</p>
 </div>
 }
 }
18. 18. 
 

19. 19. 
 
 
 
 
 
 

20. 20. 

21. 21. 
 
 
 
 

22. 22. 
 
 

23. 23. 
 

24. 24. handleOnClick = (e):void => {
 e.preventDefault();
 browserHistory.push("/members"')
 };
25. 25. 

26. 26. 

27. 27. 
 
 
 

28. 28. 
 

29. 29. 
 
 

30. 30. 
 

31. 31. 
 

32. 32. 

33. 33. 
 

34. 34. 
 
 
 

35. 35. 
 
 

36. 36. 
 

37. 37. 

38. 38. 

39. 39.