Coder Social home page Coder Social logo

erenakbaba / secure-your-single-page-web-app-with-low-code-on-ibm-cloud Goto Github PK

View Code? Open in Web Editor NEW

This project forked from ibmdevelopermea/secure-your-single-page-web-app-with-low-code-on-ibm-cloud

0.0 1.0 0.0 2.48 MB

In this Workshop, you’ll learn how with App ID, you can easily protect your Node.js front-end web applications. we will have a simple authentication flow up and running in less than 20 minutes. we will learn how to customise our login page and add several features of App ID.

Home Page: https://www.crowdcast.io/e/journey-to-low-code-no-code-app-security-1/

secure-your-single-page-web-app-with-low-code-on-ibm-cloud's Introduction

Secure your single page web app with low code on IBM Cloud

Pre-requisite:

Node package manager installed in your PC using link: https://nodejs.org/en/

To learn how to install node.js in your PC watch this video: https://www.youtube.com/watch?v=__7eOCxJyow

Step 1: Sign-up/Login to IBM Cloud

1.1- If you are an existing user please this link to Login: https://ibm.biz/appsecurity

And if you are not, don't worry! We have got you covered! There are 3 steps to create your account on IBM Cloud:

1.2- Put your email and password.

1.3- You get a verification link with the registered email to verify your account.

1.4- Fill the personal information fields.

** Please make sure you select the country you are in when asked at any step of the registration process.

Screen Shot 2021-05-31 at 11 25 01 AM

Step 2: Create an instance of AppID service

2.1- In the search bar type "App ID", click the instance from search result, it will take you to a new window. Click create botton to start your App ID instance

1

2.2- Click create botton to start your App ID instance

2

Step 3: Download Node.js Sample single page Web Application

3.1- From overview, click on Download sample and select Node.js

3

3.2- Save the zip file named "SampleApp-Node" and extract it on your desktop or any other path that you prefer

Step 4: Run the Sample application locally

4.1- To confirm your local Host URI was added to the list of allowed redirect URIs. a Manage Authentication > Authentication Settings, http://localhost:3000/

4

4.2- Open terminal/ cmd/ windows PowerShell and navigate to the sample folder. Run the following commands to build and start the application

Build:

npm install

Run app:

npm start

5

Step 5: Test User Authentication

5.1- Open your application in browser by pasting your localhost URi

6

5.2- Click on Login and you will be redirected to login poage.

7

5.3- Here you can see your application has Authentication process, where you can either signu/signin using Social Credentials or your email address. Enter your credentials and login to your test app

8

Step 6 (Optional): Customize Login Page

6.1- You can customize your login page by selecting "Login Customization" from your App ID Dashboard

9

Workshop Resources

Done with the workshop? Here are some things you can try further

configure social identity providers to set up a single sign-on experience for your app : https://cloud.ibm.com/docs/appid?topic=appid-social&interface=ui

Links to the next sessions in "Journey to Low Code/ No Code Application Security"

28th September- 7PM-9PM (GMT+5)

30th September- 7PM-9PM (GMT+5)

secure-your-single-page-web-app-with-low-code-on-ibm-cloud's People

Contributors

asnajaved avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.