Building Our First Surface Component
Learn how to build a Surface component from scratch.
Installing and configuring Surface
We know that Surface provides syntactic sugar for defining and rendering components, along with type checking and a few other niceties. Now it’s time to build our very first Surface
component and explore these features. To do so, we started by adding the Surface
dependency to our pento/mix.exs
file, like this:
{:surface, "~> 0.3.2"},
There’s only one Surface
dependency, but we’ll need a bit more configuration. We want Phoenix reloading to kick in when users change Surface
template files, so we update the config/dev.exs
file as shown here:
patterns: [...~r"lib/pento_web/(live|views)/.*(ex)$",~r"lib/my_app_web/live/.*(sface)$"]
Then, install it by running mix deps.get
command like this:
mix deps.get
After this command, the surface is installed and configured.
We already installed it on Educative’s platform.
We’re ready to use it in our Phoenix app.
Defining a
...Get hands-on with 1400+ tech skills courses.