📗 THE Book on Full-Stack Web Application Development covering User Experience (UX) Design/Tests, HTML5, Responsive + Functional CSS, Functional JavaScript, Mobile/Offline/Security First, Progressive Enhancement, Node.js, Hapi.js, Redux, React (Native), Elm, Elixir+Phoenix, Continuous Integration/Deployment, Testing (UX/TDD/BDD), Performance-Dri…
Switch branches/tags
Nothing to show
Clone or download
Latest commit 5043e95 Apr 17, 2018

README.md

The Practical "Book"

on Crafting Full-Stack Web Applications

A step-by-step guide to "Full Stack" Web Application Development for people building beautiful, robust & maintainable web / mobile app individually or in teams!

man-who-doesnt-read Substitute the word "man" for "person" and the "read" for "code" for the 21st Century equivalent.
Coding is the new literacy and people who don't make the time to learn/practice are destined for disappointment.

Why? start with why

Why Should Anyone Learn How to Build Web Apps Today?

Think/say what you like about Steve, he was right about (at least) one thing:

steve jobs learn how to code!

Considering that there are millions of "Apps" already, why should I (or anyone for that matter) bother learning how to make more of them?

This is a great question and one we ask ourselves @dwyl often!
The answer is another question: do you think all the world's problems/challenges have been resolved...? To which the answer is: not even close!

Someone recently asked: "Is software engineering a dead end career?"
https://www.quora.com/Is-software-engineering-a-dead-end-career

It's true (logical) that eventually there will be "enough apps" to achieve "all the things" we need, but "experts" have been predicting the "end of software" for the last 20 years. And yet, the pace of change continues to accelerate and the number of jobs that aren't being filled because the "skills shortage" has increased sharply in recent years: http://www.bbc.co.uk/news/education-36783460

"Software is eating the world" ~ Marc Andreessen http://www.wsj.com/articles/SB10001424053111903480904576512250915629460
Tip: disable JS in your browser to read the article without Rupert forcing you to pay for knowledge! Five Years Later: https://techcrunch.com/2016/06/07/software-is-eating-the-world-5-years-later/

For the foreseeable future creating web applications with the tools/techniques outlined in this book will be a "thing".

"You can mass-produce hardware; you cannot mass-produce software - you cannot mass-produce the human mind"" ~ Michio Kaku

Thankfully, (or perhaps sadly depending on your view), software cannot be mass produced yet ... Should you/we be "afraid" of AI or embrace it...? A topic for another time ... for now, focus levelling-up your skills, so you can understand the AI debate!

"What's In It For Me?"

What's "In It" For Me?

Our "podium" list of what you will gain by learning this "content":

  1. The vocabulary to have technical discussions with web developers (without sounding like a "poser" which is not the same as a "beginner" ...) even if you decide not be a full-time coder, if you know how to code, you will have a far more fruitful time working with technical people.
  2. A chance to Meet & collaborate with interesting people on using technology to make the world a better place for everyone!
  3. (last but not least) The "skills to pay the bills" which will let you build your own ideas or get paid (really well) to work on a challenge with an existing team.

image

As with any skill, your coding skills are whatever you make of them!

Why Write a "Book"?

The main reason we decided to organize our knowledge/experience as a "book" is because people were using (and loving) our tutorials individually.

people-find-dwyl-tutorials-useful

but people kept asking us:

Question: "Is there an order in which I should follow your tutorials...?"
Answer: Yes!

So we wanted to present our series of tutorials in a reasonably systematic/linear format that anyone can follow in an order.

The reasons we did not state the order of learning before were that:

  • the sheer number of "things" to learn would have overwhelmed us.
  • there were so many "gaps" in our documentation that we would have suffered from a panic-induced "blank page syndrome" or writer's block and never got started!

We are very conscious of the fact that there is a "lot to learn" in order to build web applications.

By making individual self-contained tutorials we were able to "chunk" the knowledge into parts that were relevant to people searching for a guide specific to that subject.

The second reason is to make it "portable". By grouping all of our tutorials in a single PDF people can put it on their e-Reader and read it "AFK" or even pipe it through a "screen reader" and listen as an Audio Book!

We wrote the individual tutorials was out of frustration/pain of working in organisations where knowledge was not distributed. Count yourself lucky if you have never worked at a company where people "hoard" and "guard" their knowledge/skill/data/insight because they think it will maintain their "power", "position" or "influence". We @dwylhq have worked in many such companies and grew weary of the "boss" who kept "secrets" or the "subject matter expert" that could not be fired even though they were killing team morale. Systematically sharing our knowledge is our way of avoiding that charade!

Who?

Readers Learners

Who should read (and practice) this...?

If you are (already) learning (or want to learn how) to build Web-based Applications (that "Work Everywhere") using Open Source, Free tools, this book (or its individual self-contained/standalone "chapters") will be relevant to you. Our aim is that the content is useful to everyone writing code at any level, but we are starting with a focus on "complete beginner" and will work our way up to "advanced", answering any question you have along the journey!

If anyone tells you that learning to code is a bad idea, just smile and think to yourself:

"Never mind what haters say, ignore them till they fade away" ~ T.I. (Live Your Life)

Writers

Unlike most other books written by one person or even handful of people, and "published" (printed) in paper this book has many contributors and is continuously evolving.

Alone we can do so little; together we can do so much” ~ Helen Keller

As such it is the Wisdom of the crowd. So if you spot an issue/typo in the text/code or have a better idea (e.g. a simpler explanation for a topic/concept), please post an issue (thanks!).

What?

This book is a collection of practical usage examples for tools we use to build web apps.
We wish we had this content before we started coding, instead we had to learn things the hard(er) way making lots of "mistakes"...

never-made-any-mistatkes

We have learned from our mistakes and documented most of them! Hopefully it's useful to other people.

What can we Make with the Knowledge/Skills in the Book?

The knowledge/skills you will gain from learning/practicing the content will allow you to build web-based applications (that "Work Everywhere") for many reasons including (to):

  • Connect & communicate with our friends, colleagues & communities
  • Record & share information, knowledge, news, events, etc.
  • Manage all aspects of our lives (calendars, task/time trackers, shopping/wish lists, etc.)
  • Run organisations/businesses (Administration, Workflow & "Management" Apps)
  • Buy/sell things (E-Commerce)
  • Have fun! (e.g. online games! augmented/virtual reality!)

Most universities/schools (still) don't teach practical web skills as the foundation for computer science / software engineering ... there are a number of reasons for this, but the primary reason is that the learning institution's curriculum is calcified by inertia...

The result of people not learning "modern" web technologies at "school" is the majority of companies/organisations still lack skills so most apps suck! We are "fixing" the "problem".

"Free" and Open Source...?

Yes, the book is 100% Free and Open Source on GitHub for anyone to read and contribute to! We (strongly) believe that all learning materials should be open and freely available to all (not controlled or "monopolized" for profit)!

There's no "up sell" or "premium" version of any of our content. Learning is not our "business" and we have no intention of charging for any of our content.

image

Some people are of the opinion that:

"If you're good at something, never do it for free." ~ The Joker (The Dark Knight)

We disagree.
Education is the most powerful weapon

Obviously, putting together learning resources takes (a lot of) time and most people don't have a lot of "free time"... But we prefer to think of our knowledge sharing as an investment in our people/team(s) that pays handsomely (and almost immediately) because it systematically "transfers knowledge" which both improves the pace of our work and reduces "risk" for our customers! Win-win-win-win!!

What "Technology Stack" is Covered?

A "stack" is the term use to describe all the components involved in a web app. The more comprehensive definition is:

"In computing, a solution stack is a set of software subsystems or components needed to create a complete platform such that no additional software is needed to support applications. Applications are said to "run on" or "run on top of" the resulting platform.

... in a web application the architect defines the stack as the target operating system, web server, database, and programming language."

A Typical Stack could include:

  • Linux/Unix as the Server Operating System (OS)
  • A Web Application Framework running on the server. Example frameworks include:
    • Ruby-on-Rails/Sinatra (Ruby),
    • Django (Python),
    • CodeIgniter/Symphony/Drupal (PHP),
    • Akka (Scala/Java),
    • Express.js/Meteor.js/Hapi.js (JavaScript/Node.js), etc.
    • Phoenix
  • A database to which the (web app) framework connects. There are many databases (often referred to as "data stores"), the most popular are:
    • SQL-Based: MySQL, PostgreSQL, MariaDB
    • NoSQL: MongoDB, CouchDB, RethinkDB, HBase, etc
    • Search: ElasticSearch
    • Key Value Store: Redis, LevelDB
  • Browser-based interactivity (often referred to as the "Client" or "Front End" of the stack)

The "Stack" we use is evolving with the industry innovation. Please see: https://github.com/dwyl/technology-stack/ and if you want to #GetInvolved in the discussion, read and comment on the issues: https://github.com/dwyl/technology-stack/issues

You Will Learn "In Demand" Tech Tools/Skills

You will learn 3 of the "Top 10" most popular technologies of 2016 (which are still just as popular/relevant in 2017!)

https://stackoverflow.com/research/developer-survey-2016#technology stackoverflow-most-popular-technologies

Most Wanted Programming Languages

And... we will also cover three of the most "Wanted" (i.e. in demand!) technology skills which are dramatically improving people's productivity, effectiveness and quality of output!

stackoverflow-other-technologies See: https://stackoverflow.com/research/developer-survey-2016#most-popular-technologies-other (Click on "Wanted" tab to see the list!)

"Full-Stack" JavaScript?

The term "Full Stack" Developer has been around for a while. We like @laurencegellert's explanation:

"a Full Stack Developer is someone with familiarity in each layer, if not mastery in many and a genuine interest in all software technology."

We agree with @peteryared that it's naive to expect anyone to be an "expert" in every aspect of our stack, but we do think that by using JavaScript as the programming language for the server (Node.js), client (take your pick of framework!) and datastore (any of the NoSQL datastores which store JSON documents), it's easier to go "full stack".

See: http://techcrunch.com/2014/11/08/the-rise-and-fall-of-the-full-stack-developer/

"Front End"?

There is one (programming) language that all web browsers "understand": JavaScript.
As a result it is the most popular programming language (see StackOverflow survey results above!)

Additionally you will need to know two other "languages": HTML and CSS ... but:

stay calm

The web browser or mobile device (displaying content in a "web view") is referred to as the "Front End".

"Back End"?

When people refer to the "Back End" of an app they are describing the "Web/Application Server" component(s); don't worry, we will cover all of this and it's surprisingly fun!

front-end-back-end

There are many technologies/languages/frameworks you can use to write your server. As stated above, for simplicity we prefer to use JavaScript (Node.js) on the server to keep one programming language across the stack and allow us to re-use view code for both server-side and client hence the expression "Full-Stack"!

Test Driven Development?

This is where we differ from almost all the other "beginner" level books! We believe in writing automated tests for all aspects of your application. So that is one of the first things you will learn how to do!

The Book is Not "Finished" Yet, Should I Start Reading It?

The answer is: it depends. If you can handle a few typos and want to get started building better Apps ASAP, then start now! If you prefer to wait till its "ready", please star the repo, and come back later.

Star the Project ⭐️

The easiest way you can contribute is by "starring" this project on GitHub! This will help you to "bookmark" the content so you can return to it. But it will also help the people who "follow" you on GitHub to discover that you find it interesting or useful.

The more people star and share the project, the more possible contributors are able to understand the value of contributing and open sourcing their knowledge!

Contributing contributions welcome

We hope this will be a (highly) collaborative effort! (We don't believe in the "lone wolf" or "basement genius" approach to building things... we prefer the many minds/eyes/ideas of Open Source culture!)

"It is amazing what you can accomplish if you do not care who gets the credit" ~ Harry Truman

Got Comments/Ideas/Suggestions/Issues ?

If you have any ideas, comments or suggestions, please raise an issue on GitHub: https://github.com/dwyl/the-book/issues

Watching the Repo (to receive ALL the updates!)

If you want to receive ALL the updates, you can Watch the GitHub repository. Note: you may get quite a few emails... but if you are interested in building great quality software the content should be relevant to you.

History (tl;dr)

I, @nelsonic started writing tutorials on Test Driven Development (TDD) out of frustration when (some individuals in) my then team complained that "testing/TDD is 'hard' and takes too long...". It seemed logical to publish the tutorials as step-by-step guides on GitHub (as opposed to a company wiki or Google Docs which I had done before...) so that complete strangers could benefit from the learning and submit ideas for improvement or requests for more detail via questions (issues), updates or corrections (e.g. updating a link or fixing a typo!) in the form of GitHub Pull Requests.

A few (hundred) GitHub stars (and encouraging feedback messages) later, we created a GitHub Community (Organisation) dedicated to curating coding tutorials: https://github.com/dwyl (which now has many active members) and collaboratively building useful tools using code which any organisation/school/business can use free of charge!

All coding examples for this book are released as self-contained/standalone tutorials so you can selectively learn a specific tool/technique/technology and share just that one byte of learning with your team (or that one special person in your life who you know has infinite potential but keeps making excuses to not get with the program!)

Ready to get Started?!