The program can’t start because MSVCR110.dll is missing

Installed wampp แต่เปิดโปรแกรมไม่ได้ ให้ทำการ downloading Visual C++ Redistributable for Visual Studio 2012 Update 4 จากเว็บนี้

https://www.easeus.com/file-recovery/program-cannot-start-because-msvcr110.dll-is-missing.html3

หลังจากนั้นเปิดโปรแกรมใหม่อีกครั้ง

Posted in wampp | Leave a comment

npm run build fails to minify

ขณะรันเทสไม่มีปัญหา แต่พอเราจะสั่ง build กลับพบ error

Failed to minify the code from this file:

    ./node_modules/base64url/dist/base64url.js:4

ผู้พัฒนาได้กำลังแก้ไขปัญหานี้ ให้เราอัพเกรด react-script จาก 1.x เป็น

"react-scripts": "2.0.0-next.3e165448"

ขณะที่ลงบทความนี้ 2.0 นั้นยังไม่ Stable

อ้างอิงจากผู้พัฒนา https://github.com/facebook/create-react-app/issues/3815

Posted in nodejs, react | Leave a comment

react with redux ฉบับมือใหม่ ทำความเข้าใจโดยสรุปอย่างง่ายที่สุด

React จะมีปัญหาในการจัดการ State ของ component ที่อยู่โดดๆ แต่ต้องการเข้าถึง State เดียวกัน ซึ่งสามารถแก้ปัญหาได้โดยการใช้ Redux เข้ามาช่วย

Redux เป็น concept มาช่วยเก็บ State ทั้งหมดไว้ที่เดียวแบบ global ซึ่งใน react นั้นจะมี library ให้ใช้คือ react-redux

“Redux holds up the state within a single location.

Also with Redux the logic for fetching and managing the state lives outside React.”

ก่อนที่จะอ่านบทความ Redux ให้คุณทบทวนตัวเองก่อนว่า มีความเข้าใจ React หรือไม่ ถ้าหากยัง ก็ยังไม่ควรไปอ่าน Redux

ให้ค่อยๆอ่านบทความข้างล่าง เป็นการใช้ react กับ redux แบบเบื้องต้น ซึ่งเป็นการ Hard-Code แสดง List View อยู่ แต่ผมรับประกันได้ ว่าคุณจะเข้าใจ concept ของ redux แต่หากยังไม่เข้าใจ ไม่ต้องท้อแท้ ให้ค่อยๆทำความเข้าใจ อ่านซ้ำเรื่อยๆ

https://www.valentinog.com/blog/react-redux-tutorial-beginners/

หลังจากอ่านจบแล้ว ให้อ่านบทความข้างล่างนี้ต่อจะ advanced ขึ้นโดยจะเป็นตัวอย่างการใช้ react กับ redux เรียก API แบบ asyc เพื่อได้ response แบบ json มาทำ List View ใช้ความสามารถของ redux ไปเต็มๆ หลังจากอ่านจบ เราจะสามารถจินตนาการถึง Web Application ลักษณะทั่วไปได้เลย

https://medium.com/@stowball/a-dummys-guide-to-redux-and-thunk-in-react-d8904a7005d3

สรุปสิ่งที่ต้องเข้าใจของการศึกษา Redux
0. React
1. Redux Reducer ทำหน้าที่คำนวณหา next state จากเงื่อนไขของการ dispatch action
2. Redux Action (action ที่เราต้องระดมสมองคิดมันขึ้นมาว่าจะมีอะไรบ้างบนเว็บไซต์ของเรา)
3. Redux Store ใช้สำหรับเป็นตัวจัดการ State โดยจะมี method สำคัญที่เราต้องรู้ 3 ตัวดังนี้

“getState for accessing the current state of the application
dispatch for dispatching an action
subscribe for listening on state changes”

สำหรับ dispatch และ subscribe ให้มองถึง concept pub/sub และเมื่อมีการ dispatch action แล้ว Redux Store จะ trigger (โดยมี subscriber ของ redux เองทำให้) Redux Reducer ให้ทำงานคำนวณ next state ต่อไป

ดังนั้น method subscribe เราเองยังไม่ค่อยได้ใช้งาน

“Internally React Redux works by calling store.subscribe() when the component mounts. Every time the Redux store changes, the subscription callback fires. Inside it, React Redux calls React setState() by taking Redux store state and passing it through mapStateToProps().”

4. connecting React with Redux
4.1 เราจะต้องใช้ Provider นำมาคลุม Component App ของเรา

Provider is an high order component coming from react-redux.

ตัวอย่าง

import React from "react";
import { render } from "react-dom";
import { Provider } from "react-redux";
import store from "./store/index";
import App from "./components/App";
render(
  <Provider store={store}>
    <App />
  </Provider>,
  document.getElementById("app")
);

4.2 mapStateToProps method (จะทำให้ทุกๆ Component ของเรานำเอา Redux State มาใช้เป็น React prop ซึ่งมองเห็นร่วมกันได้)
4.3 mapDispatchToProps method (เช่นเดียวกัน จะทำให้ทุกๆ Component นำเอา Redux Store มาใช้เป็น React prop ซึ่งมองเห็นร่วมกันได้)
4.4 connect

เป็นอะไรที่คนที่มาศึกษาใหม่ จะเหมือนเปลี่ยนโลกไปเลย อาจจะต้องทำ Project ที่ต้องใช้ React with Redux จริงๆถึงจะเข้าใจมากขึ้นอย่างแท้จริง

Posted in react, redux | Leave a comment

react webpack allow external ip

add host: ’0.0.0.0′ at webpack.config.js

devServer: {
    inline: true,
    contentBase: './app',
    port: 9000,
    host: '0.0.0.0'
  }
Posted in react | Leave a comment

ไม่เคยเขียนโปรแกรมมาก่อนควรเริ่มต้นอย่างไร

แน่นอนว่าการจะเริ่มต้นอะไรสักอย่างเป็นเรื่องที่ยาก การเริ่มเคยโปรแกรมก็เช่นกัน วันนี้จึงขอให้เทคนิคง่ายๆถ้าเกิดว่าเราต้องการที่จะเริ่มต้นเขียนโปรแกรมจะเริ่มต้นได้อย่างไร

การเขียนโปรแกรมก็คล้ายกับสิ่งที่เจอในชีวิตประจำวันของเรา ถ้าเกิดว่าเราต้องการทำอะไรสักอย่าง เราก็จำเป็นที่จะต้องรู้ว่ากระบวนการทำงานของมันเป็นอย่างไร ถ้าเกิดว่าเราพูดถึงกระบวนการการทำงานของโปรแกรมคอมพิวเตอร์หรือระบบคอมพิวเตอร์ ถ้าเกิดว่าเราเคยเรียนในระดับมัธยมปลาย จะมีอยู่ 3 อย่างคือ In-put > Process > Out-put หรือว่า นำเข้าข้อมูล > ประมวลผล > แสดงผล

โปรแกรมส่วนใหญ่ที่เราใช้งานอยู่ทุกวันนี้ไม่ว่าจะเป็น Facebook, Twitter, Instagram, YouTube มันก็มาจากหลักง่ายๆพวกนี้ทั้งสิ้น ดังนั้นถ้าเกิดเราอยากรู้ว่าโปรแกรมนั้นสร้างอย่างไร เราต้องคิดขั้นตอนต่างๆให้ออกมาชัดเจน คิมพิวเตอร์นั้นเปรียบเหมือนเด็กอายุประมาณ 3 ขวบที่ไม่สามารถคิดหรือทำอะไรด้วยตัวเองได้ แต่คอมพิวเตอร์สามารถคำนวณได้เก่งมากๆ หมายความว่าสามารถคำนวณตัวเลขได้เป็นล้านครั้งใน 1 วินาที

ด้วยความที่คอมพิวเตอร์ฉลาดแต่ไม่สามารถคิดอะไรด้วยตัวเองได้ ตัวเราเองในฐานะที่เป็นคนสร้างโปรแกรม เราจะต้องทำการกำหนดขั้นตอนการทำงานให้กับคอมพิวเตอร์ ดังนั้นเราจำเป็นต้องมีทักษะพื้นฐานที่สำคัญ อย่างแรกคือการคิดอย่างเป็นระบบ คอมพิวเตอร์นั้นแตกต่างจากการทำงานของสมองคนเราค่อนข้างเยอะ เพราะว่าสมองของคนเรานั้นมักจะคิดอะไรได้อย่างอัตโนมัติไว้หมดแล้ว แต่คอมพิวเตอร์นั้นโปรแกรมเราจำเป็นต้องกำหนดให้ละเอียดทุกขั้นตอนเพราะว่าคอมพิวเตอร์นั้นเหมือนเด็ก 3 ขวบที่ไม่สามารถคิดเองได้ อีก 2 ทักษะที่มีความสำคัญมากๆคือสามารถเขียนโปรแกรมคอมพิวเตอร์ได้แม้ว่าคุณจะไม่เก่งคณิตศาสตร์ก็ตาม เพราะว่าตัวโปรแกรมคอมพิวเตอร์ที่เราเขียนขึ้นนั้นสามารถเปิดดู Google ควบคู่ไปได้ อีกทักศะหนึ่งที่สำคัญคือภาษาอังกฤษ แต่ถ้าคุณไม่เก่งภาษาอังกฤาก็สามารถเขียนโปรแกรมคอมพิวเตอร์ได้เช่นกัน โดยหลักการนั้นจะคล้ายคลึงกับทักษะคณิตศาสตร์ที่เพิ่งกล่าวไป ถ้าหากเราไม่รู้คำศักท์คำไหนก็สามารถเปิด Google ได้นั่นเอง โดยทั่วไปแล้วคำศัพท์ที่ใช้นั้นเป็นคำศัพท์ที่ง่ายที่มารวมกันกลายเป็นประโยค แต่ถ้าทั้ง 2 ทักษะที่ผ่านมาคุณมีพื้นฐานที่ดี ก็จะทำให้การเขียนโปรแกรมนั้นไปได้เร็วมากขึ้น

จะเขียนโปรแกรมคอมพิวเตอร์ เราต้องรู้ว่าต้องเริ่มจากอะไรดี เล่น goldenslot โดยที่สามารถเริ่มจากภาษาอะไรก็ได้เพราะภาษาของคอมพิวเตอร์ก็เปรียบได้เหมือนเครื่องมืออันหนึ่งเท่านั้น แต่ถ้าจะให้ยกตัวอย่าง ถ้าคุณอยากพัฒนาโรแกรมคอมพิวเตอร์แบบปกติ ขอแนะนำให้ใช้ภาษา C, C# หรือ Java แต่ถ้าเกิดต้องการเขียนแอพลิเคชั่นบน Android ถ้าใช้ Java จะดีที่สุด หรือถ้าต้องการพัฒนาเว็บไซต์ แนะนำให้ใช้ HTML, PHP หรือ JavaScript

Posted in ไม่มีหมวดหมู่ | Leave a comment