Search Code
Search Code by entering your search text above.
git basics - git init, git commit, git all, git *

create a new repository git init the following code can be typed in a terminal window, once you have installed git for your OS. This will create a directory called git-test assuming you already hav..

3:23 am, April 22, 2022
Create Strings using Template Literals

if you use the backtick to enclose your strings you no longer have to use \n for a new line.  For example: `this is a multiline ...string!!` Console Example

5:55 am, December 29, 2021
Hello world in C and seeing what it is actually doing

One of the most simple C applications, how to compile it and how to objdump it.  C #include int main() { int i; for(i=0;i < 10; i++) { puts("Hello Mac\n"); } return ..

12:25 pm, December 12, 2021
convert json string to a php array

takes a json string in php and converts it into a php array using the json_decode function.

11:44 pm, November 16, 2021
how to json encode an array in php

12:05 pm, November 16, 2021
How to Access Props Using this.props in React

If you would like to access a class component prop within its self you can do this using the this keyword.

5:15 am, October 19, 2021
How to Pass Props to a Stateless Functional Component in React

Props are like properties that you can pass into a component in react. A prop would be something like this in your component.  JSX <div>  <MyProp id="1234" /></div> The..

12:24 am, October 16, 2021
How to Create a React Component using the ES6 class method

One way to add a react component is to use the Stateless Functional Component method, and another way is to use the ES6 extends syntax. This method seems more complex than the 1st for some reason mayb..

11:39 pm, October 12, 2021
How to Render HTML Elements to the DOM with React

Once you have a JSX element defined you can write it to the page with ReactDOM.render(componentToRender, targetNode),  In this example we are targeting the div with the id challenge-node. JSX ..

11:43 pm, October 11, 2021
Create a Simple JSX Element

The current code uses JSX to assign a div element to the constant JSX. Replace the div with an h1 element and add the text Hello JSX! inside it.

11:19 pm, October 11, 2021
adding react with JSX using babel

just wanted to see how JSX would work with react and babel, so this way you can write JSX and babel compiles it for use with react.  This is apparently not a good way to do things and can be qui..

9:18 am, October 11, 2021
using babel for react compiling in browser

this is currently just an idea, as i saw that codepen uses babel to run react i was wondering i can do the same thing here and then just write normal react script and have babel compile it.  so ..

8:41 am, October 11, 2021
react hello world with time and date updating

here is a react hello world with the date and time updating on setInterval 1000 miliseconds.  Again with react it has to be compiled from JSX for it to work, so i have included the original and ..

4:12 am, October 11, 2021
react hello world with variable name

i was just testing some of the hello world examples on the react site, and as they use JSX they cant be directly entered into your code, so you need to run a pre compiler (not sure of the exact term f..

4:00 am, October 11, 2021
react basic hello world

the most basic hello world using react js

11:29 pm, October 10, 2021
test php bundle write

just testing

1:49 am, August 26, 2021
set the html of an element javascript

this will set the innerhtml value of an element

11:34 pm, March 8, 2021
Monitoring Visible Objects on Screen

i found this one when researching how to detect visible objects on screen, and then doing something with them. This one does not use any external scripts to change the box colour as it becomes visible..

12:07 am, December 1, 2020
Leaflet Quick Start Example

just a quick start map embed for leaflet js an alternative to google maps

4:45 am, October 26, 2020
get the last letter of a string

you can use the .length and the index of a string to get its last value

4:40 am, July 16, 2019
simple dropdown navigation ul li css

demo .dropdown { position: relative; display: inline-block; } .dropdown-content { display: none; position: absolute; background-color: #f9f9f9; min-width: 16..

6:20 am, August 31, 2018

This is my test area for webdev. I keep a collection of code here, mostly for my reference. Also if i find a good link, i usually add it here and then forget about it.

You could also follow me on twitter or not... does anyone even use twitter anymore?

If you found something useful or like my work, you can buy me a coffee here. Mmm Coffee. ☕


Random Quote

Random CSS Property


The contain CSS property allows an author to indicate that an element and its contents are, as much as possible, independent of the rest of the document tree. This allows the browser to recalculate layout, style, paint, size, or any combination of them for a limited area of the DOM and not the entire page, leading to obvious performance benefits.
contain css reference