Build a Chatroom
Last updated
Last updated
We are going to build a full stack application using React/TypeScript frontend and Go backend. The Go backend is a server that can receive websocket messages from clients and broadcast them to other clients.
Part 3 of .
dep
Dep is an awesome dependency management tool for Go, it's equivalent to npm
for JavaScript. You can learn more about .
go-get
The following command will install dep
to your Go workspace. When you run dep
in terminal, the binary is discoverable because you have your GOPATH configured.
brew
If you are a Mac user, there is one more convenient option for you. You can use Homebrew! Simply run the following.
dep
Once dep
is installed, you can run dep init
to initialize a dep environment for your project.
You will see Gopkg.lock
and Gopkg.toml
files. Now run dep ensure
.
You can copy and paste the front end code in my chatroom/frontend
folder. However, please feel free to write your own frontend implementation.
We are going to use JavaScript's native WebSocket
class to establish websocket connection to the server.
Client-side socket connection typically accepts 4 callbacks:
Callback is invoked when socket is opened.
Callback is invoked when socket receives a message.
Callback is invoked when socket encounters an error.
Callback is invoked when socket is closed.
I am using babel and webpack for compiling the latest ES6/ES7 syntax into browser compatible version. I am also using node-sass
for compiling .scss
into .css
. I make promise-based requests to server using axios
. For the complete list of node modules, please look at the package.json
.
index.js
Navigate to the frontend/
folder and run the following npm commands.
Remember to run npm run build
, otherwise you won't see an index.js
in your public
folder.