Skip to content

Instantly share code, notes, and snippets.

Avatar

Anita Czapla heron2014

View GitHub Profile
@heron2014
heron2014 / react-native-maps-enable-google-maps-instructions.md
Last active Apr 29, 2021
Visual instructions how to enable Google Maps on IOS using react-native-maps
View react-native-maps-enable-google-maps-instructions.md

Visual instructions how to enable Google Maps on IOS using react-native-maps

UPDATE: Following instructions are now a year old. I have recently managed to upgrade react-native-maps from 0.17 to the latest version 0.21 with react-native 0.51 - if you want to follow my instruction scroll down to the end this doc! Hope that will work for you too!

This is for my personal use, things might not be correctly explained here. For the official docs please check https://github.com/airbnb/react-native-maps

Steps from scratch:

1.react-native init GoogleMapPlayground

@heron2014
heron2014 / useEffect-key-takeaways.js
Last active Dec 29, 2020
Key takeaways for useEffect
View useEffect-key-takeaways.js
useEffect(fn) // run function on every render
useEffect(fn, []) // run function only when the component is first rendered
useEffect(fn, [value]) //run function when component is first rendered and when the `value` changes
// Remember if you pass dependency(value) which is an object - React perform
// strict comparision using "===" of the first level properties and will not
// conduct comparisons deeper into the properties.
@heron2014
heron2014 / useEffect-componentWillUnmount.js
Created Dec 1, 2020
useEffect componentWillUnmount - clean up
View useEffect-componentWillUnmount.js
// Class
componentWillUnmount() {
console.log('I am unmouting');
}
// Hooks
useEffect(() => {
return () => console.log('I am unmounting, run me to do any clean up');
}, [])
View useEffect-componentDidUpdate.js
// Class
componentDidUpdate(prevProps, prevState) {
console.log('Prev state', prevState); // Before update
console.log('New state', this.state); // After update
}
// Hooks
useEffect(() => {
// The big difference here is that useEffect doesn't provide previous state/prop value.
View useEffect-componentDidMount.js
// Class
componentDidMount() {
console.log('Run me only when the component is first rendered/mounted');
}
// Hooks
useEffect(() => {
console.log('Run this arrow function only when the component is first rendered/mounted');
}, [])
@heron2014
heron2014 / useEffect-every-render.js
Created Dec 1, 2020
useEffect - on every render
View useEffect-every-render.js
useEffect(() => {}) // run arrow function every time the component is rendered
@heron2014
heron2014 / getAllInheritedPropNames.js
Created Dec 7, 2016
Getting all inherited property names of an object
View getAllInheritedPropNames.js
const getAllInheritedPropNames = (obj) => {
let props = [];
do {
props = props.concat(Object.getOwnPropertyNames(obj));
} while (obj = Object.getPrototypeOf(obj));
return props;
};
View react-lifecycle-parent-child.jsx
import React from "react";
import { render } from "react-dom";
const ParentComponent = React.createClass({
getDefaultProps: function() {
console.log("ParentComponent - getDefaultProps");
},
getInitialState: function() {
console.log("ParentComponent - getInitialState");
return { text: "" };
@heron2014
heron2014 / hapi-boom-json-api.js
Created Jul 22, 2016
hapi plugin to reformat boom errors to json-api
View hapi-boom-json-api.js
exports.register = function (plugin, options, done) {
plugin.ext('onPreResponse', function (request, reply) {
var response = request.response;
if (response.isBoom) {
var error = {
title: response.output.payload.error,
status: response.output.statusCode,
detail: response.output.payload.message