Forem: Radhakishan Jangid

Add free ssl on apache2 server ubuntu

Radhakishan Jangid — Thu, 01 Jun 2023 07:35:35 +0000

नमस्ते 🙏

Free free free 🤩 🥳

Run following command to install free certificate on apache2 server.

Run this command to update existing packages.

sudo apt update

Run this command to install certbot, which provides free certificate for 1 year.

sudo apt install certbot python3-certbot-apache

After successfully installation run this command to get free ssl

sudo certbot --apache

After, enter an email address to get notification when your ssl is about to expire.

Agree to their terms and condition.

Enter your domain where you wants to install ssl.

Congratulations! You have successfully installed free certificate on your domain.

Verifying Certbot Auto-Renewal

To auto renewal run following commands:

sudo systemctl status certbot.timer

Your output will be similar to the following:

Output
● certbot.timer - Run certbot twice daily
     Loaded: loaded (/lib/systemd/system/certbot.timer; enabled; vendor preset:>
     Active: active (waiting) since Mon 2022-04-11 20:52:46 UTC; 4min 3s ago
    Trigger: Tue 2022-04-12 00:56:55 UTC; 4h 0min left
   Triggers: ● certbot.service

Apr 11 20:52:46 jammy-encrypt systemd[1]: Started Run certbot twice daily.

To test the renewal process, you can do a dry run with certbot:

sudo certbot renew --dry-run

Output
Saving debug log to /var/log/letsencrypt/letsencrypt.log

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Processing /etc/letsencrypt/renewal/your_domain.conf
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Account registered.
Simulating renewal of an existing certificate for your_domain and www.your_domain.com

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Congratulations, all simulated renewals succeeded:
  /etc/letsencrypt/live/your_domain/fullchain.pem (success)
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

If you don’t receive any errors, you’re all set. When necessary, Certbot will renew your certificates and reload Apache to pick up the changes. If the automated renewal process ever fails, Let’s Encrypt will send a message to the email you specified, warning you when your certificate is about to expire.

Mongodump and Mongorestore

Radhakishan Jangid — Thu, 27 Apr 2023 09:24:12 +0000

Use following command to generate archive of mongodb dump database.

mongodump --db <database_name> --gzip --archive=./dump

Use following command to generate json of mongodb dump database.

mongodump -d <database_name -o ./dump

Use following command to import archive of mongodb dump into database.

mongorestore --gzip --archive=./dump

Hope it helps you.
😊

Secret affair of Node.js - Environment Variables.

Radhakishan Jangid — Tue, 24 Jan 2023 06:04:44 +0000

So today I am presenting you guys "Secret affair of Node.js - Environment Variables"

When you build a Node.js application you want them to run everywhere. This could be on your colleagues’ computers, internal company servers, cloud servers, or inside of a container (maybe using Docker).
This is the time when we use environment variables.

Environment variables are a fundamental part of developing with Node.js, allowing your app to behave differently based on the environment you want them to run in. Wherever your app needs configuration, you use environment variables. And they’re so simple, they’re beautiful!

Today, this post will help you create and use environment variable in your Node.js application.

Example of using ENV:

// server.js const port = process.env.PORT; console.log('Your port is ${port}');

Create a file named server.js and put the above code in the file. Now when you run this file you will see a message "Your port is undefined".
This is because there isn't any enviornment variable right now.

So for that we create a File name .env.

Create the .env file in the root of your app and add your variables and values to it.

NODE_ENV=development
PORT=8626
# Set your database/API connection information here
API_KEY=**************************
API_URL=**************************

Remember Your .gitignore File

A .env file include many security related data, so you better put this file into gitignore.
Open or create .gitignore file and add
.env
anywhere in the file.

Now install Install dotenv from npm

npm install dotenv

Now read the env data like this

// server.js console.log('Your port is ${process.env.PORT}'); // undefined const dotenv = require('dotenv'); dotenv.config(); console.log('Your port is ${process.env.PORT}'); // 8626

Now run your code
node server.js.

This is it, now you can use any variable like this

process.env.Variable.

GoodBye :)

React-Native Expo Form Validation Component Library with Floating Label!

Radhakishan Jangid — Fri, 06 Nov 2020 09:15:13 +0000

React-Native Expo Form Validation Component Library with Floating Label!

😉 Hey! I'm Radhakishan Jangid 😎. More about me Here ↩.

ℹ️ validate-form-in-expo-style is a Simple form validation component with floating label for React-Native inspired by react-native-form-validator. You can add floating label with this library and can validate form. I created this package for my personal use you can use it in yours too.

My bad, that I don't have Mac or IPhone, so this library is tested only in android. Do check it in Mac and let me know if any problem occurs.

📋 Table of Contents

Install
Supported Types
Default Validation Rules
Example
How to use
Props
Methods
Contributing
License

📥 Install

$ npm install validate-form-in-expo-style

$ yarn add react-native-stylish-accordion

Now we need to install react-native-reanimated and react-lifecycles-compat.
If you are using Expo, to ensure that you get the compatible versions of the libraries, run:

expo install react-native-reanimated react-native-gesture-handler react-lifecycles-compat

If you are not using Expo, run the following:

yarn add react-native-reanimated react-native-gesture-handler react-lifecycles-compat

✔️ Supported types:-

TextInput

📝 Default Validation Rules are:-

matchRegexp
isEmail
isEmpty
required
trim
isNumber
isFloat
isPositive
minNumber
maxNumber
minFloat
maxFloat
minStringLength
maxStringLength
isString

Some rules that are added in validationName can accept extra parameter for validation, like:

<InputText
   {...otherProps}
   validateNames={['minNumber:1', 'maxNumber:255', 'matchRegexp:^[0-9]$']}
/>
```

`
***🎥 See the full example of form validation in react-native Expo:-***
----------
[![Watch the video](https://i.ytimg.com/vi_webp/y7bkVDu0LVA/maxresdefault.webp)](https://youtu.be/y7bkVDu0LVA)

***💡 How to use:-***
----------

`

```javascript
import React from 'react';
import { StyleSheet, View, Text, Dimensions, TouchableOpacity, Image, ScrollView } from 'react-native';
import { Form, InputText } from 'validate-form-in-expo-style';
import { FontAwesome, Feather } from "@expo/vector-icons";
class App extends React.Component {
    state = {
        first_name: "",
        number: "",
        last_name: "",
        email: '',
        user: { password: "", repeatPassword: "" },
    }
    componentDidMount() {
        //You can add your own rules
        Form.addValidationRule('isValidPassword', (value) => {
            let passwordReg = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[a-zA-Z]).{8,}$/;
            if (passwordReg.test(value) === false) {
                return false;
            }
            return true;
        });
        Form.addValidationRule('isPasswordMatch', (value) => {
            if (value !== this.state.user.password) {
                return false;
            }
            return true;
        });
    }
    componentWillUnmount() {
       // Remove own rules
        Form.removeValidationRule('isPasswordMatch');
        Form.removeValidationRule('isValidPassword');
    }

    handlePassword = (event) => {
        const { user } = this.state;
        user.password = event.nativeEvent.text;
        this.setState({ user });
    }

    handleRepeatPassword = (event) => {
        const { user } = this.state;
        user.repeatPassword = event.nativeEvent.text;
        this.setState({ user });
    }

    handleChange = (email) => {
        this.setState({ email });
    }

    handleFirstName = (first_name) => {
        this.setState({ first_name });
    }
    handleLastName = (last_name) => {
        this.setState({ last_name });
    }
    handleNumber = (number) => {
        this.setState({ number });
    }
    submit = () => {
        alert("form submit, thank you.")
    }
    handleSubmit = () => {
        this.refs.form.submit();
    }
    render() {
        let Image_Http_URL = { uri: 'https://radhakishan.vpran.in/img/radhakishan-web-3.jpg' };
        const { user } = this.state;
        return (
            <ScrollView>
                <View style={[styles.container, {marginTop: 50}]}>
                    <View style={[styles.action, { alignItems: "center" }]} >
                        <Image source={Image_Http_URL} style={{ width: 100, height: 100, borderRadius: 100 / 2 }} />
                        <FontAwesome name="github" size={24} /><Text style={{fontSize: 18}}>radhakishan404</Text>
                        <Text style={{ fontSize: 20, padding: 10 }}>validate-form-in-expo-style</Text>
                    </View>
                    <View style={styles.action} >
                        <Form ref="form" onSubmit={this.submit} >
                            <InputText
                                name="first_name"
                                label="First Name"
                                placeholder="textfield with floating label"
                                validateNames={['required', "isString", "maxStringLength:30"]}
                                errorMessages={["This field is required", "Only characters allowed", "Max character limit is 30"]}
                                value={this.state.first_name}
                                onChangeText={this.handleFirstName}
                                type="text"
                                leftIcon={<FontAwesome name="user-o" color="#0A3055" size={20} />}
                                invalidIcon={< Feather
                                    name="alert-circle"
                                    color="red"
                                    size={20}
                                />}
                                validIcon={<Feather name="check-circle" color="green" size={20} />}
                            />
                            <InputText
                                name="last_name"
                                placeholder="textfield without floating label"
                                validateNames={['required', "isString", "maxStringLength:30"]}
                                errorMessages={["This field is required", "Only characters allowed", "Max character limit is 30"]}
                                value={this.state.last_name}
                                onChangeText={this.handleLastName}
                                type="text"
                                leftIcon={<FontAwesome name="user-o" color="#0A3055" size={20} />}
                                invalidIcon={< Feather
                                    name="alert-circle"
                                    color="red"
                                    size={20}
                                />}
                                validIcon={<Feather name="check-circle" color="green" size={20} />}
                            />
                            <InputText
                                name="phone"
                                label="Mobile"
                                placeholder="textfield with only number"
                                validateNames={['required', "isNumber", "maxStringLength:10"]}
                                errorMessages={["This field is required", "Only numbers allowed", "Max string limit is 10"]}
                                value={this.state.number}
                                onChangeText={this.handleNumber}
                                type="text"
                                leftIcon={<FontAwesome name="phone" color="#0A3055" size={20} />}
                                invalidIcon={< Feather
                                    name="alert-circle"
                                    color="red"
                                    size={20}
                                />}
                                validIcon={<Feather name="check-circle" color="green" size={20} />}
                            />
                            <InputText
                                name="email"
                                label="email"
                                validateNames={['required', 'validEmail']}
                                errorMessages={['This field is required', 'Enter valid email address']}
                                placeholder="textfield with email validation"
                                type="text"
                                keyboardType="email-address"
                                value={this.state.email}
                                onChangeText={this.handleChange}
                                leftIcon={<FontAwesome name="user-o" color="#0A3055" size={20} />}
                                invalidIcon={< Feather
                                    name="alert-circle"
                                    color="red"
                                    size={20}
                                />}
                                validIcon={<Feather name="check-circle" color="green" size={20} />}
                            />
                            <InputText
                                name="password"
                                label="Password"
                                secureTextEntry
                                validateNames={['isValidPassword', 'required']}
                                errorMessages={['Minimum eight characters, at least one uppercase letter, one lowercase letter and one number', 'This field is required']}
                                type="text"
                                value={user.password}
                                placeholder="custom password validation"
                                leftIcon={<FontAwesome name="lock" color="#0A3055" size={20} />}
                                onChange={this.handlePassword}
                                invalidIcon={< Feather
                                    name="alert-circle"
                                    color="red"
                                    size={20}
                                />}
                            />
                            <InputText
                                name="repeatPassword"
                                label="Confirm Password"
                                secureTextEntry
                                validateNames={['isPasswordMatch', 'required']}
                                errorMessages={['Password mismatch', 'This field is required']}
                                type="text"
                                value={user.repeatPassword}
                                placeholder="Confirm your password"
                                onChange={this.handleRepeatPassword}
                                invalidIcon={< Feather
                                    name="alert-circle"
                                    color="red"
                                    size={20}
                                />}
                                leftIcon={<FontAwesome name="lock" color="#0A3055" size={20} />}
                            />
                            <TouchableOpacity
                                activeOpacity={0.8}
                                onPress={this.handleSubmit}
                                style={styles.appButtonContainer}
                            >
                                <Text style={styles.appButtonText}>Submit</Text>
                            </TouchableOpacity>
                        </Form>
                    </View>
                </View>
            </ScrollView>
        );
    }
}

export default App;

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#fff',
        alignItems: 'center',
        justifyContent: 'center',
    },
    action: {
        width: Dimensions.get('window').width,
        padding: 20
    },
    appButtonContainer: {
        elevation: 8,
        backgroundColor: "#009688",
        borderRadius: 10,
        paddingVertical: 10,
        paddingHorizontal: 12,
        marginTop: 10
    },
    appButtonText: {
        fontSize: 18,
        color: "#fff",
        fontWeight: "bold",
        alignSelf: "center",
        textTransform: "uppercase"
    }
});
```

`
***🔗 Props***
----
#### Form Props

| Prop            | Required | Type     | Default value | Description                                                                                                                  |
|-----------------|----------|----------|---------------|------------------------------------------------------------------------------------------------------------------------------|
| onSubmit        | true     | function |               | Callback for form that fires when all validations are passed                                                                 |
| instantValidate | false    | bool     | true         | If true, form will be validated after each field change. If false, form will be validated only after clicking submit button. |
| onError         | false    | function |               | Callback for form that fires when some of validations are not passed. It will return array of elements which not valid. |
| debounceTime    | false    | number   | 0             | Debounce time for validation i.e. your validation will run after `debounceTime` ms when you stop changing your input |

#### InputText Props

| Prop            | Required | Type     | Default value | Description                                                                            |
|-----------------|----------|----------|---------------|----------------------------------------------------------------------------------------|
| name            | true     | string   |               | Name of input field |
| label           | false    | string   |               | Name of input Floating Label  |
| placeholder | false | string  |               | Placeholder of input before any value      |
| validateNames   | false    | array    |               | Array of validation. See list of default validation rules in above example.                             |
| errorMessages   | false    | array    |               | Array of error messages. Order of messages should be the same as `validateNames` prop.    |
| errorStyle      | false    | object   | { container: { top: 0, left: 0, position: 'absolute' }, text: { color: 'red' }, underlineValidColor: 'gray', underlineInvalidColor: 'red' } }             | Add your own error styles                                                                          |
| validatorListener | false  | function |               | It triggers after each validation. It will return `true` or `false`                    |
| withRequiredValidator | false | bool  |               | Allow to use `required` validator in any validation trigger, not only form submit      |
| leftIcon | false | code, image  |               | Either include image or add Icon tag code to display left icon see above example |
| invalidIcon | false | code, image  |               | Either include image or add Icon tag code to display error icon on right side see above example |
| validIcon | false | code, image  |               | Either include image or add Icon tag code to display success icon on right side see above example |
| secureTextEntry | false | bool  |     false          | If true than show hide icon will get added automatically |

***🔗 Methods***
----
#### Form Methods

| Name             | Params | Return | Descriptipon                                       |
|------------------|--------|--------|----------------------------------------------------|
| resetValidations |        |        | Reset validation messages for all validated inputs |
| isFormValid      | dryRun: bool (default true) | Promise   | Get form validation state in a Promise (`true` if whole form is valid). Run with `dryRun = false` to show validation errors on form |
#### InputText Methods

| Name             | Params | Return | Descriptipon                                       |
|------------------|--------|--------|----------------------------------------------------|
| getErrorMessage  |        |        | Get error validation message                       |
| validate         | value: any, includeRequired: bool | | Run validation for current component |
| isValid          |        | bool   | Return current validation state                    |
| makeInvalid      |        |        | Set invalid validation state                       |
| makeValid        |        |        | Set valid validation state                         |

***💼 Contributing***
----

This component covers all my needs, but feel free to contribute.

***🖋 License***
---
[MIT © Radhakishan Jangid](https://radhakishan.vpran.in)

react-native-stylish-accordion package

Radhakishan Jangid — Sat, 31 Oct 2020 12:29:07 +0000

react-native-stylish-accordion

Simple Stylish React Native Accordion

Install
Usage
License

Install

$ npm install react-native-stylish-accordion

$ yarn add react-native-stylish-accordion

Now we need to install react-native-reanimated and react-native-animatable.

If you are using Expo, to ensure that you get the compatible versions of the libraries, run:

expo install react-native-reanimated react-native-gesture-handler react-native-redash

If you are not using Expo, run the following:

yarn add react-native-reanimated react-native-gesture-handler react-native-redash

Note

This is created with the help of "react-native-accordion-view" package.

Usage

import StylishAccordion from 'react-native-stylish-accordion'

export default function App() {
  const [firstOpen, setFirstOpen] = useState(false);
  const [secondOpen, setSecondOpen] = useState(false);

  return (
    <View style={styles.container}>
        <StylishAccordion
        open={firstOpen}
        title="Click me first"
        onPress={() => setFirstOpen(!firstOpen)}
        titleStyle={{ fontSize: 18, fontWeight: "bold" }}
        headerStyle={[styles.accordionHeader]}
        subContainerStyle={[styles.accordionSubContainer]}
        timingTransition={150}
        iconSize={14}
        >
            <View>
            <Text>You clicked me thanks for testing this package, this is my first package, do give it a start in GitHub</Text>
            </View>
        </StylishAccordion>
        <StylishAccordion
            open={secondOpen}
            title="Click me first not that"
            onPress={() => setSecondOpen(!secondOpen)}
            titleStyle={{ fontSize: 18, fontWeight: "bold" }}
            headerStyle={[styles.accordionHeader]}
            subContainerStyle={[styles.accordionSubContainer]}
            timingTransition={150}
            iconSize={14}
        >
            <View>
            <Text>You clicked me thanks for testing this package, this is my first package, do give it a start in GitHub</Text>
            </View>
        </StylishAccordion>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
  accordionHeader: {
    backgroundColor: "#ff9d9d",
    borderTopLeftRadius: 12,
    borderTopRightRadius: 12,
    marginLeft: 5,
    marginRight: 5,
    marginBottom: 10,
    shadowColor: '#000',
    shadowOffset: { width: 0, height: 2 },
    shadowOpacity: 0.8,
    shadowRadius: 2,
    elevation: 8,
  },
  accordionSubContainer: {
    backgroundColor: "#fff",
    marginLeft: 5,
    marginRight: 5,
    shadowColor: '#000',
    shadowOffset: { width: 0, height: 2 },
    shadowOpacity: 0.8,
    shadowRadius: 2,
    elevation: 8,
    marginBottom: 13,
  },
});

Props

title (string)
titleStyle (TextStyle)
iconSize (number)
headerStyle (ViewStyle)
subContainerStyle (ViewStyle)
style (ViewStyle)
headerComponent (ReactNode)
open (boolean)
onPress (void)
timingTransition (number default:400) opening speed
containerRadius (number)

ReactJs - Health Monitoring System - Patient-Doctor Live Chat!

Radhakishan Jangid — Wed, 19 Aug 2020 05:08:01 +0000

Health Monitoring System - Patient-Doctor Live Chat!

Hey! I'm Radhakishan Jangid. Check my portfolio from Here ↩.

Health Monitoring System is a simple web project where patients can add their readings and doctors can check patient's readings and can send direct messages to each other through the application. Both patients and doctors need to log in or register before proceeds. Both patient and doctors can live chat with each other.

Features:-

Patient:

Login, Register, Forget Password.
Add, Edit, Delete, List (CRUD) for patient readings.
Chart view for Readings.
Profile Edit.
Doctors Message List.
Live Chat with doctors.

Doctor:

Login, Register, Forget Password.
List of patients.
Live search of patients.
Chart view details about patients.
Direct message to patients.
Live Chat with Patients.

Languages & tools:-

React Js,
HTML,
CSS,
JS,
VS Code,
Sublime,
Google Chrome,
PHP,
MySql,
CMD

Live Demo

Click here for live demo ↩.

How to use?

First Install Node Js Version 14.8.0 from Here ↩.
Copy the repo into your disk.

$ git clone git@github.com:ruanyf/react-demos.git

Then go to your project directory using this command.

$ cd project-directory

After navigating to your project directory run this command to download all the node modules.

$ npm install

After the installation successful run this command to run the application. This command will start your react app and run it into the browser.

$ npm start

Hooray! Then play with the source files under the directories.

Note:

After the start of the project, you have to integrate the PHP API for storing the data in the database.

For that follow the below step.

📝 Install XAMPP or WAMPP Server

Download Xampp Server from Here ↩.

📝 Create a Folder
Navigate into your xampp folder, in the drive where you have install the XAMPP Server. Then go to htdocs folder (If xampp installed) or www folder (If wampp installed).
Create new folder by clicking on New Folder from the top panel or right-click on mouse and create new folder.
Name that folder as Health-monitoring-system or anything you want.

✎ Add PHP Script

Now, go to the health-monitoring-api directory in this repo or in the downloaded repo, copy Ctrl+c or cut Ctrl+x all the files added in the folder and paste it into your respective folder.

✎ Create a Database

Now, open the PHPMyAdmin from your localhost server: localhost/phpmyadmin.
Create a database and name it as health-monitoring or anything you want.
There is a SQL file in the API folder health-monitoring.sql, import this file in the created database.

✎ Changes in Files

Now the most important part, to call an API we need to make some changes in API's.
Open the health-monitoring-php folder, then open include folder, in this folder we need to make changes in two files only.

First, open config.php file and make the following changes.

if (PROJECTSTATUS == "LIVE") {  // DEFAULT TO LIVE
    DEFINE('BASE_URL', '');
} else if (PROJECTSTATUS == "STAGING") {  // DEFAULT TO STAGING
    DEFINE('BASE_URL', ''); 
} else { // DEFAULT TO DEV
    DEFINE('BASE_URL', 'http://localhost/health-monitoring/'); // change this url to your localhost url.
}

Change "http://localhost/health-monitoring/" to your respective URL.
Now open database.php file and make the following changes.

$this->connection = new mysqli("localhost", "root", "", "health_monitoring");

In this line:
- localhost is your hostname,
- root is your database login access,
- "" is your database password,
- health-monitoring" is your database name.
Change the database name as your respective database name.

⌨ Quick Test of API

Now we are going to check if our API is running or Not.
For that run Login.php in your browser by typing.
- http://localhost/health-monitoring-php/Login.php in our browser.
- After running if you get any error please follow the process from start, if not getting any error then you are good to go ahead.
Hooray... Here we complete our API Integration.
Now we need to make some changes to React Code too.

✎ Change API URL

Open your react folder code in your code editor. I am using VS Code.
Open constants.js from src folder and change the BASE_URL variable value into your API Url.

Change this BASE_URL value into your API URl.

export const BASE_URL = "http://localhost/health-monitoring-php";

✌ Run the Application

After your npm command

npm start

completed you will see a screen like this.
Either you can register or login through the following credentials:
- Patient Login
  - Email: patient@test.com
  - Pass: 12345
  - Type: Patient
- Doctor Login
  - Email: doctor@test.com
  - Pass: 12345
  - Type: Doctor

Important Notes

Contact me through Telegram from Here for any query or write mail to me on radhakishanjangid404@gmail.com with the subject "Issue in Health-monitoring-system".
Do suggest any change if you see any problem in code or any better way to do this project.
Download the source code from my github account or click Here ↩.
This project was bootstrapped with Create React App.

Available Scripts

In the project directory, you can run:

`npm start`

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.
The page will reload if you make edits.
You will also see any lint errors in the console.

`npm test`

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

`npm run build`

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.
Your app is ready to be deployed!
See the section about deployment for more information.

`npm run eject`

Note: this is a one-way operation. Once you eject, you can’t go back!

If you aren’t satisfied with the build tool and configuration choices, you can eject at any time. This command will remove the single build dependency from your project.
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except eject will still work, but they will point to the copied scripts so you can tweak them. At this point, you’re on your own.
You don’t have to ever use eject. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However, we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.

Resources

ReactJS: Refer to https://reactjs.org/ to understand the concepts of ReactJS.
React Bootstrap: Refer to https://react-bootstrap.github.io/getting-started/introduction/ to understand how to use React Bootstrap

Learn More

You can learn more in the Create React App documentation.
To learn React, check out the React documentation

Forem: Radhakishan Jangid

Add free ssl on apache2 server ubuntu

Mongodump and Mongorestore

Secret affair of Node.js - Environment Variables.

React-Native Expo Form Validation Component Library with Floating Label!

React-Native Expo Form Validation Component Library with Floating Label!

📋 Table of Contents

📥 Install

✔️ Supported types:-

📝 Default Validation Rules are:-

react-native-stylish-accordion package

react-native-stylish-accordion

Table of Contents

Install

Note

Usage

Props

ReactJs - Health Monitoring System - Patient-Doctor Live Chat!

Health Monitoring System - Patient-Doctor Live Chat!

Features:-

Languages & tools:-

Live Demo

How to use?

📝 Install XAMPP or WAMPP Server

📝 Create a Folder

✎ Add PHP Script

✎ Create a Database

✎ Changes in Files

⌨ Quick Test of API

✎ Change API URL

✌ Run the Application

Important Notes

Available Scripts

npm start

npm test

npm run build

npm run eject

Resources

Learn More

`npm start`

`npm test`

`npm run build`

`npm run eject`