Skip to content

Instantly share code, notes, and snippets.

Avatar

Kingsley Tagbo kingsleytagbo

View GitHub Profile
@kingsleytagbo
kingsleytagbo / newsletter.html
Created Nov 18, 2020
Angular Template Driven Form Validation (Bootstrap) - Newsletter Signup
View newsletter.html
<form #newsletterForm="ngForm" (ngSubmit)="newsletterForm.form.valid && onSubmit(newsletterForm)">
<div class="form-group">
<label>Your Email Address</label>
<input type="email" name="email" class="form-control" [(ngModel)]="user.email" #email="ngModel"
[ngClass]="{ 'is-invalid': newsletterForm.submitted && email.invalid }" required>
<div class="invalid-feedback" *ngIf="newsletterForm.submitted && email.invalid">
<p *ngIf="email.errors.required">*Email address is required</p>
</div>
</div>
@kingsleytagbo
kingsleytagbo / Api.tsx
Created Oct 22, 2020
React Native - Login Form Function Component
View Api.tsx
const API_URL = 'https://nodejsappapi.herokuapp.com';
const mockSuccess = (value:any) => {
return new Promise((resolve) => {
setTimeout(() => resolve(value), 2000);
});
};
const mockFailure = (value:any) => {
return new Promise((resolve, reject) => {
@kingsleytagbo
kingsleytagbo / Home.tsx
Created Oct 1, 2020
ReactJS - Custom Toast Messages Component
View Home.tsx
import { IonContent, IonHeader, IonPage, IonTitle, IonToolbar } from '@ionic/react';
import React, { useState } from 'react';
import HomeContainer from '../components/HomeContainer';
import PageFooter from '../components/PageFooter';
import PageHeader from '../components/PageHeader';
import './Home.css';
import Toast from '../components/utilities/Toast';
const Home: React.FC = () => {
const [authenticated, setKey] = useState(false);
@kingsleytagbo
kingsleytagbo / UtilityProvider.ts
Last active Nov 18, 2020
Reusable Ionic Angular Toast Component
View UtilityProvider.ts
import { Injectable } from '@angular/core';
import { ToastController } from '@ionic/angular';
@Injectable({providedIn: 'root'})
export class UtilityProvider{
constructor( private toast: ToastController){}
/**
@kingsleytagbo
kingsleytagbo / footer.html
Created Sep 12, 2020
Ionic Angular - Page Footer Component & Module
View footer.html