Nitrogen for web newbie

[Daniel Goertzen]

The Nitrogen book and much of the documentation seems to be oriented towards Erlang newbies with existing web expertise.  I'm the opposite: I have Erlang chops but am a web newbie.  Can anyone recommend a book or 2 to backfill my knowledge so I can make the most out of Nitrogen?

The project I am working towards is to make a web UI for an embedded device that already runs Erlang.  I want to provide configuration, control, and inspection of operational state.  Nitrogen looks perfect for this task.

Thanks,

Dan.

[Sant Parkash Singh]

+1

--
You received this message because you are subscribed to the Google Groups "Nitrogen Project / The Nitrogen Web Framework for Erlang" group.
To unsubscribe from this group and stop receiving emails from it, send an email to nitrogenweb...@googlegroups.com.
To post to this group, send email to nitro...@googlegroups.com.
Visit this group at http://groups.google.com/group/nitrogenweb.
For more options, visit https://groups.google.com/d/optout.

[Jesse Gumm]

Hi Daniel,

That is a great question. I'm the first to admit that just about everything about the documentation does indeed slant itself that way.

I came from a web background before doing Erlang, so it's certainly easier for me to think from that perspective. But as you (and Sant) have obviously pointed out, there are folks who don't have lots of web experience, but have Erlang figured out already.

I'm not sure the best source for learning the basics of web dev, but the basics to learn are HTML, CSS, and Javascript.

HTML very easy to grok, and should take a couple hours to wrap your head around it - it's almost all memorization.

CSS theoretically is easy, but practically ends up having edge cases and oddities that make even the most experienced Web gurus scratch their head and want to punch walls (which explains the popularity of layout frameworks like bootstrap and the like). Again CSS is just a lot of memorization, and early on, a lot of googling to remember if a rule is (for example) "whitespace:no-wrap" or "white-space:nowrap".  A book that served me well for CSS was  "CSS: The Ultimate Reference" by Tommy Olsson.

Javascript, for all its oddities, is a capable language. I learned a lot of Javascript from the 1st edition of the O'Reilly Javascript book, though that  book must be 15 years old now, and I think is on a 3rd or 4th edition.

Jquery is a pretty simple js framework that Nitrogen uses that takes advantage of CSS selectors to simplify working with the DOM (the html structure of the page).

Truthfully, as long as you can cover HTML, CSS, and (to a lesser extent, Javascript since Nitrogen does a pretty good job of abstracting away Javascript), and a little bit of jquery, you should be good to go.  Like any good geek, I'd trust anything from Pragmatic Bookshelf, O'Reilly, or No Starchvfor any of those resources.

The above all said, perhaps I could write up a "primer for Web Development" appendix for the book.

Anyway, don't hesitate to ask if you're confused. Like I said, I come from a web background, so I don't have a solid mental model of what is non-obvious when learning webdev for the first time. Asking even simple questions will do a great service to help me determine what info needs to be presented and in what way.

Thanks for the great question,

-Jesse

> --
> You received this message because you are subscribed to the Google Groups
> "Nitrogen Project / The Nitrogen Web Framework for Erlang" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to nitrogenweb...@googlegroups.com.
> To post to this group, send email to nitro...@googlegroups.com.
> Visit this group at http://groups.google.com/group/nitrogenweb.
> For more options, visit https://groups.google.com/d/optout.

--
Jesse Gumm
Owner, Sigma Star Systems
414.940.4866 || sigma-star.com || @jessegumm

[ll...@writersglen.com]

Hi Dan,

You don't really need a book, though many excellent books are in print.

You can find the basics on the web:

http - https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol
html - https://en.wikipedia.org/wiki/HTML
css - https://en.wikipedia.org/wiki/Cascading_Style_Sheets

Follow up with:

http://www.w3schools.com/html/
http://www.w3schools.com/css/

In addition to these overview links there are many fine how-tos and tutorials that demonstrate how to build a website/ web application. Here's one. A bit of web surfing will turn up many others.

http://www.2createawebsite.com/build/build-html-website.html

For fun, play around with html augmented with css. You can write html and css files in vim, view the html files in your browser. I just now wrote this in vim and saved it as test.html in my home directory:

<html>
<head>My First Web Page<title>
</title>
</head>
<body>
<p>
Onward and upward!
</p>
</body>
</html>

And viewed in my browser with:

file:///home/lloyd/test.html

Read up on Nginx: https://www.nginx.com/

This is one of many webservers. It's small, fast, and easy to install--- nice for testing and deploying static sites.

https://www.nginx.com/
https://www.nginx.com/resources/admin-guide/serving-static-content/

An understanding of Nginx will also help orient you Erlang's Cowboy web server:

https://github.com/ninenines/cowboy

You can compare and contrast Cowboy with:

http://erlang.org/doc/apps/inets/http_server.html
https://github.com/mochi/mochiweb
https://github.com/klacke/yaws

A possible next step is exploration/mastery of JavaScript and any one of a double handful of web frameworks. But wait? This is what Nitrogen gives you.

Our next release of Build It Fast with Nitrogen will show you how to build a notes application from scratch, connect it to several different db back ends, and put it into production on Digital Ocean.

When? Real Soon Now.

We also have on our radar a complete soup-to-nuts invoicing system. But that won't happen until the end of volleyball season.

Hope this helps.

All the best,

Lloyd R. Prentice

Thanks,
Dan.

--

[Daniel Goertzen]

Thanks for all the tips guys.

I actually do have a few more web basics than I let on, but I was thrown back into virgin newbie territory when I came across "container_12", "suffix_2", and friends in the book.  I had no idea where these were coming from and it gave me a good jolt of frustration (I later unwound the mystery with grep and google).  That was in chapter 3, and in chapter 5 there is more usage and even a mention of 960.gs, but it wasn't enough for me to connect the dots at the time.  A one or 2 sentence explanation of 960.gs and the concept of CSS packs at first use in chapter 3 would have kept things perfectly clear for me.

Cheers,

Dan.

PS Thank you both for your hard work on Nitrogen.  I look forward to experimenting with Nitrogen web UIs in the coming days.

[Jesse Gumm]

Ha, good catch. Thanks! I'll have to add an issue to give a quick intro to 960gs when we first introduce it's use.

Thanks!

[Lloyd R. Prentice]

Hey Danny,

They totally mystified me too. Nitrogen definitely has poorly documented nooks and corners. We'd welcome your input once you have your feet more firmly planted.

All the best,

Lloyd

Sent from my iPad