Teaching Newbies since 2014

kauress

You are here: Home / Archives for Web Dev

Tricks learned this month

To ignore remote changes and overwrite them git push origin –force The token conveyor belt:  use hidden input fields to pass  ‘info’ between POST & GET requests (if  there is no user entered info into an input field which can be  ‘gotten’ through req.body). Use case:  in script.js  assign the value of  an element’s “innerHTML” property to be the value of a  hidden input. This

[ Read More ]

Conditionally rendering EJS template with res.locals in express.js

This snippet is to conditionally render navbar items based on whether a user is logged in OR not.  So toggle the ‘Login’ button to ‘Logout’ if the user is already logged in and vice versa. I admit it took more time that I had anticipated. Primarily because in the beginning I insisted on using a global variable in express to manage the user’s ‘isAuthenticated’  state

[ Read More ]

Twitter Bootstrap in a day

##Introduction note: work in progress So you have to code/make a website in 30 minutes for someone that scales on laptops, mobiles and tablets. What do you do? : Code your own front-end library overnight Use Twitter Bootstrap The answer is you use Twitter Bootstrap as you only have 30 minutes during lunch break. Because why do you want to waste your lunch break coding

[ Read More ]

10 min guide to CSS3 Grid Layout

Introduction CSS3 Grid Layout is great for controlling layout with rows AND columns! 1. Create the structure of the layout (i.e. # of rows and columns) 2. Place items on the layout (manually or through auto placement) Forge on Getting started Placing items on a grid: “display:grid” [codepen_embed height=”300″ theme_id=”21517″ slug_hash=”WWELoK” default_tab=”result” user=”Kauress”]See the Pen CSS3 Crash Notes: Part 1 by Kauress (@Kauress) on CodePen.[/codepen_embed]

[ Read More ]

Coding worksheet #4: Callback functions

Just something I made as a primer. I’ve tried to condense as much information I could for ‘scoped’ learning [codepen_embed height=”300″ theme_id=”21517″ slug_hash=”ZRjGxr” default_tab=”html,result” user=”Kauress”]See the Pen You used to callback on my cellphone, code worksheet by Kauress (@Kauress) on CodePen.[/codepen_embed]

[ Read More ]

Newbie guide: socket.IO

Guide Introduction What happens? Summary Set up the main project directory Install dependencies Directory structure Create a server in index.js Set up index.html Test your server 10.Make your first socket connection Conclusion Resources Note: This guide covers till setting up socket.IO to be used. A chat app using socket.IO will ensue in part 2 Introduction Socket.IO is a JavaScript library which allows real time bidirectional

[ Read More ]