Monday, 5 August 2024

Could not detect rake tasks on HEROKU

 1. .gitignore file me ye add karna hai

node_modules

yarn.lock

2. nvm install 20.9.0


3. nvm  use 20.9.0


BUNDLED WITH

   2.3.25


check this history:

heroku buildpacks:set heroku/ruby

 2155  node -v

 2156  nvm  use 20.9.0

 2157  nvm install 20.9.0

 2158  nvm  use 20.9.0

 2159  git status

 2160  git add node_modules/.yarn-integrity

 2161  git add .gitignore

 2162  git commit -m"Remove Node modukle"

 2163  yarn install

 2164  git status

 2165  git add .gitignore

 2166  git rm --cache yarn.lock

 2167  git status

 2168  git commit -m"Remove yarn"

 2169  git push origin(name)   isme branch ka use nhi karna hai

 2170  heroku config:get BUILDPACK_URL

 2171  heroku config:get BUILDPACK_URL --app equinemd

 2172  heroku buildpacks

 2173  heroku buildpacks --app equinemd

 2174  heroku buildpacks:set heroku/ruby --app equinemd

 2175  curl https://cli-assets.heroku.com/install-ubuntu.sh | sh

 2176  bundle lock --add-platform x86_64-linux

 2177  git status

Thursday, 25 July 2024

Js validation and password show and hide in admin side OR Web page

1. app/admin/app_users.rb
form do |f|

    render 'form', context: self, f: f

  end

-------------------------------------------------------

2. IN Active admin side : app/views/admin/users/_form.html.erb

<% context.instance_eval do

    semantic_form_for resource, url: admin_users_path do

  # f.semantic_errors *f.object.errors.keys

      f.inputs 'Details' do

f.input :first_name, required: true, :as => :string, label: "Name"

      f.input :full_phone_number, input_html: {maxlength: 12, onkeypress: "return onlyNumberKey(event)"}, required: true

      f.input :email, required: true

      f.input :user_name, required: true

      f.input :activated, label: "Activate",input_html: {checked: true}

      f.input :role, as: :select, collection: BxBlockRolesPermissions::Role.all, include_blank: false, :input_html => { :width => 'auto', "data-placeholder" => 'Click' }

      f.input :password, label: "Password",:input_html => {id: "account_password"}, required: true

      f.hidden_field :temporary_password


  end

f.inputs 'Organization Profile' do

    f.semantic_fields_for :profile do |s|

  s.input :name, label: "Organization name"

      s.input :business_location

      s.input :address

      s.input :email

      s.input :contact_no

      s.input :license_no

      s.input :fiscal_year

      s.input :city

      s.input :state

      s.input :pin_code

      s.input :website_url

      s.input :fax_no

      s.input :profile_pic, as: :file

    end

  end


  f.actions

  end

  end

%>


<script type="text/javascript">

$('#account_password').after("<label class='password_show_hided' onclick='password_show_hide();'><i class='fas fa-eye' id='hide_eye'></i><i class='fas fa-eye-slash' id='show_eye' style='display: none;'></i></label>");

function onlyNumberKey(evt) {

    var ASCIICode = (evt.which) ? evt.which : evt.keyCode

    if (ASCIICode > 31 && (ASCIICode < 48 || ASCIICode > 57))

      return false;

    return true;

  }

$(document).ready(function() { 

  jQuery.validator.addMethod("lettersonly", function(value, element) {

    return this.optional(element) || value.match(/^[a-zA-Z]+$/);

  });

  jQuery.validator.addMethod("fullPhoneNo", function(phone_number, element) {

    phone_number = phone_number.replace(/\s+/g, "");

    return this.optional(element) || phone_number.length == 12 && 

    phone_number.match(/^((\+[1-9]{1,4}[ \-]*)|(\([0-9]{2,3}\)[ \-]*)|([0-9]{2,4})[ \-]*)*?[0-9]{3,4}?[ \-]*[0-9]{3,4}?$/);

  });

  jQuery.validator.addMethod("checkEmail", function(value, element) {

    return this.optional(element) || value.trim().match(/^(([^<>()\[\]\\.,;:\s@"']+(\.[^<>()\[\]\\.,;:\s@"']+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/);

  });

  jQuery.validator.addMethod("checkUsername", function(value, element) {

    return this.optional(element) || value.match(/^[A-Za-z0-9]*$/);

  });


  jQuery.validator.addMethod("checkPassword", function(value, element) {

    return this.optional(element) || value.match(/^(?=.*[A-Z])(?=.*[#!@$&*?<>',\[\]}{=\-)(^%`~+.:;_])(?=.*[0-9])(?=.*[a-z]).{8,}$/);

  });


  $("#new_account").validate({

    rules:{

      'account[first_name]':

      {

        required: true,

        minlength: 3,

        lettersonly: true

      },

      'account[full_phone_number]':

      {

        required: true,

        fullPhoneNo: true,

        minlength: 12,

        maxlength: 12

      },

      'account[email]':

      {

        required: true,

        checkEmail: true

      },

      'account[user_name]':

      {

        required: true,

        checkUsername: true

      },

      'account[password]':

      {

        required: true,

        checkPassword: true

      },

    },messages:{

'account[first_name]':{

required: "<p class='inline-errors'>Please enter first name</p>",

minlength: "<p class='inline-errors'>Please enter valid first name</p>",

lettersonly: "<p class='inline-errors'>Please enter valid first name</p>"

},

'account[full_phone_number]':{

required: "<p class='inline-errors'> Please enter mobile number</p>",

fullPhoneNo: "<p class='inline-errors'>Please enter valid mobile number</p>",

minlength: "<p class='inline-errors'>Please enter valid mobile number</p>",

maxlength: "<p class='inline-errors'>Please enter valid mobile number</p>"

},

'account[email]':{

required: "<p class='inline-errors'>Please enter email id</p>",

checkEmail: "<p class='inline-errors'>Please enter a valid email address.</p>"

},

'account[user_name]':{

required: "<p class='inline-errors'>Please enter user name</p>",

checkUsername: "<p class='inline-errors'>Please enter valid user name</p>"

},

'account[password]':{

required: "<p class='inline-errors'>Please enter password</p>",

checkPassword: "<p class='inline-errors'>Please enter a valid password (ex: Aa@12345, min. length 8)</p>"

}

    }

  });

  $("#edit_account").validate({

    rules:{

      'account[first_name]':

      {

        required: true,

        minlength: 3,

        lettersonly: true

      },

      'account[full_phone_number]':

      {

        required: true,

        fullPhoneNo: true,

        minlength: 12,

        maxlength: 12

      },

      'account[email]':

      {

        required: true,

        checkEmail: true

      },

      'account[user_name]':

      {

        required: true,

        checkUsername: true

      },

      'account[password]':

      {

        checkPassword: true

      },

    },messages:{

'account[first_name]':{

required: "<p class='inline-errors'>Please enter first name</p>",

minlength: "<p class='inline-errors'>Pleaseee enter valid first name</p>",

lettersonly: "<p class='inline-errors'>Please enter valid first name</p>"

},

'account[full_phone_number]':{

required: "<p class='inline-errors'> Please enter mobile number</p>",

fullPhoneNo: "<p class='inline-errors'>Please enter valid mobile number</p>",

minlength: "<p class='inline-errors'>Please enter valid mobile number</p>",

maxlength: "<p class='inline-errors'>Please enter valid mobile number</p>"

},

'account[email]':{

required: "<p class='inline-errors'>Please enter email id</p>",

checkEmail: "<p class='inline-errors'>Please enter a valid email address.</p>"

},

'account[user_name]':{

required: "<p class='inline-errors'>Please enter user name</p>",

checkUsername: "<p class='inline-errors'>Please enter valid user name</p>"

},

'account[password]':{

checkPassword: "<p class='inline-errors'>Please enter a valid password (ex: Aa@12345, min. length 8)</p>"

}

    }

  });

});

function password_show_hide() {

  var x = document.getElementById("account_password");

  var show_eye = document.getElementById("show_eye");

  var hide_eye = document.getElementById("hide_eye");

  // hide_eye.classList.remove("d-none");

  if (x.type === "password") {

    x.type = "text";

    show_eye.style.display = "block";

    hide_eye.style.display = "none";

  } else {

    x.type = "password";

    show_eye.style.display = "none";

    hide_eye.style.display = "block";

  }

}

$('#account_password').keyup(function() {

    var password = this.value;

    $("#account_temporary_password").val(password);

});

</script>

<style type="text/css">

#account_first_name-error, #account_last_name-error, #account_full_phone_number-error, #account_user_name-error {

width: 100% !important;

    padding-bottom: 12px !important;

}

#account_password-error {

width: 100% !important;

}

#account_email_input #account_email-error{

width: 100% !important;

    padding-bottom: 12px !important;

    color: #932419;

font-weight: bold;

margin: 0.3em 0 0 20%;

}

#account_email_input #account_email-error p.inline-errors{

margin: auto !important;

}

.password_show_hided{

font-weight: bold;

margin: -1.9em 0 0 91%;

width: 22px;

    cursor: pointer;

    position: absolute;

    text-align: center;

}


.fas{

line-height: unset !important;

}

@media only screen and (max-width: 1060px) {

  .password_show_hided{

margin: -1.9em 0 0 90%;

}

}


@media only screen and (max-width: 958px) {

  .password_show_hided{

margin: -1.9em 0 0 89%;

}

}


@media only screen and (max-width: 444px) {

  .password_show_hided{

margin: -1.9em 0 0 72%;

}

}

</style>

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous" />

Tuesday, 18 June 2024

get records from two date rails

if params[:start_date].present? && params[:end_date].present?
        userids = UserIncentive.where("created_at >= ? AND created_at <= ?", params[:start_date].to_date, params[:end_date].to_date).map(&:user_id).uniq
      else

How to use elasticsearch for searching step by step

  1. Add the elasticsearch and elasticsearch-model gems: Add these to your Gemfile:

    ruby
    gem 'elasticsearch-model' gem 'elasticsearch-rails'

    Then run:

    sh
    bundle install

Step 3: Configure Elasticsearch in Rails

  1. Create an Elasticsearch Configuration File: Create a file named config/elasticsearch.yml with the following content:

    yaml
    development: url: http://localhost:9200 test: url: http://localhost:9200 production: url: <your-production-elasticsearch-url>
  2. Create an Initializer: Create an initializer file config/initializers/elasticsearch.rb:

    ruby
    Elasticsearch::Model.client = Elasticsearch::Client.new host: ENV['ELASTICSEARCH_URL'] || 'localhost:9200'

Step 4: Integrate Elasticsearch with Your Models

  1. Include Elasticsearch in Your Model: Let's say you have a Post model. Include Elasticsearch and its necessary modules:

    ruby
    class Post < ApplicationRecord include Elasticsearch::Model include Elasticsearch::Model::Callbacks end
  2. Customize Your Elasticsearch Index: You can customize how your model is indexed. Add an index definition to your model:

    ruby
    class Post < ApplicationRecord include Elasticsearch::Model include Elasticsearch::Model::Callbacks settings do mappings dynamic: false do indexes :title, type: :text, analyzer: 'english' indexes :content, type: :text, analyzer: 'english' end end end
  3. Index Existing Records: After setting up your model, you need to index your existing records:

    ruby:
    Post.import # for importing all records to Elasticsearch

Step 5: Implement Search Functionality

  1. Add a Search Method in Your Model:

    ruby:
    class Post < ApplicationRecord include Elasticsearch::Model include Elasticsearch::Model::Callbacks settings do mappings dynamic: false do indexes :title, type: :text, analyzer: 'english' indexes :content, type: :text, analyzer: 'english' end end def self.search(query) __elasticsearch__.search( { query: { multi_match: { query: query, fields: ['title^10', 'content'] } } } ) end end
  2. Create a Controller Action for Search: In your controller, add a search action:

    ruby;
    class PostsController < ApplicationController def search @posts = Post.search(params[:query]).records end end
  3. Add a Route for Search: In your config/routes.rb:

    ruby:
    get 'search', to: 'posts#search'
  4. Create a View for Search: Create a search view app/views/posts/search.html.erb:

    <h1>Search Results</h1> <%= form_with url: search_path, method: :get do %> <%= text_field_tag :query, params[:query] %> <%= submit_tag 'Search' %> <% end %> <% @posts.each do |post| %> <div> <h2><%= post.title %></h2> <p><%= post.content %></p> </div> <% end %>


++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

after used this code i am getting this errors Elastic::Transport::Transport::Errors::NotFound in Posts#search Showing /home/bittern/Desktop/rinku/projects/simple_dummy/app/views/posts/search.html.erb where line #7 raised:

[404] {"error":{"root_cause":[{"type":"index_not_found_exception","reason":"no such index [posts]","resource.type":"index_or_alias","resource.id":"posts","index_uuid":"na","index":"posts"}],"type":"index_not_found_exception","reason":"no such index [posts]","resource.type":"index_or_alias","resource.id":"posts","index_uuid":"na","index":"posts"},"status":404}

ChatGPTThe error you are encountering, Elastic::Transport::Transport::Errors::NotFound: no such index [posts], indicates that the Elasticsearch index for your Post

Steps to Resolve the Error

  1. Create the Index: Use the import method to create the index and populate it with your existing records. Run the following command in your Rails console:

    ruby
    Run: Post.import(force: true)

    This command will create the posts index in Elasticsearch and add all existing Post records to the index.

    Ager Ye wala step chal rha hai to Second wala nhi chalana (2. Ensure Elasticsearch is Running)

  2. Ensure Elasticsearch is Running: Make sure that your Elasticsearch service is running. You can check the status of Elasticsearch with the following command:

    sh
    Run: sudo systemctl status elasticsearch

    If it is not running, start it with:

    sh
    sudo systemctl start elasticsearch
  3. Check Elasticsearch Connection: Verify that your Rails application can connect to Elasticsearch. You can do this by testing a simple query in the Rails console:

    ruby
    Post.__elasticsearch__.client.cluster.health

    This should return the health status of your Elasticsearch cluster.

  4. you can use the following steps:

    1. Delete the Existing Index: You can delete the existing index using the Rails console:

      ruby

      Run: Post.__elasticsearch__.client.indices.delete index: Post.index_name
    2. Recreate and Populate the Index: After deleting the index, recreate and populate it with:

      ruby:
      Run: Post.__elasticsearch__.create_index!(force: true) Run: Post.import

Thursday, 18 January 2024

Active admin category and sub category in the form

 ActiveAdmin.register BxBlockCatalogue::Catalogue, as: 'Catalogue' do

  menu parent: "Catalogue Management"

  actions :all, :except => [:new]

  permit_params :category_id, :sub_category_id, :brand_id, :name, :sku, :description, :manufacture_date, :length, :breadth, :height, :availability, :stock_qty, :weight, :price, :recommended, :on_sale, :sale_price, :discount, :block_qty, :account_id, :product_number, catalogue_variants_attributes: [:id, :name, :description, :catalogue_variant_color_id, :catalogue_variant_size_id, :price, :stock_qty, :length, :breadth, :height, :block_qty, :sku, :_destroy]

  scope("All Catalogues", default: true) do |scope|

    scope.joins(:account)

  end

  scope("Seller Catalogues") do |scope|

    scope.joins(:account).where(accounts: { role: "seller" })

  end

  scope("Stylist Catalogues") do |scope|

    scope.joins(:account).where(accounts: { role: "stylist" })

  end

  filter :category, as: :searchable_select

  filter :sub_category, as: :searchable_select

  filter :name

  filter :sku

  filter :availability

  filter :stock_qty

  filter :product_number

  filter :account, as: :searchable_select

  filter :category_status, as: :select, collection: -> { BxBlockCategories::Category.all.pluck(:status).uniq.map { |status| [status.titleize, status] } }

  filter :created_at

  filter :updated_at

  index do

    selectable_column

    id_column

    column :category

    column :sub_category

    column :name

    column :sku

    column :description

    column :availability

    column :stock_qty

    column :product_number

    # column :account

    column "Account" do |object|

      if object.account.role == "seller"

        link_to object&.account&.full_name, "/admin/sellers/#{object.account_id}"

      elsif object.account.role == "stylist"

        link_to object&.account&.full_name, "/admin/stylists/#{object.account_id}"

      elsif object.account.role == "driver"

        link_to object&.account&.full_name, "/admin/drivers/#{object.account_id}"

      else

        object.account

      end

    end

    column "Catalogue Status" do |object|

      object&.category&.status&.titleize

    end

    column :created_at

    # column :updated_at

    actions do |cat|

      item "Variants", "/admin/catalogue_variants?q[catalogue_id_eq]=#{cat.id}&commit=Filter&order=id_desc", class: "member_link"

    end  

  end

  show do

    attributes_table do

      row :category

      row :sub_category

      row :name

      row :sku

      row :description

      row :availability

      row :stock_qty

      row :product_number

      row "Account" do |object|

        if object.account.role == "seller"

          link_to object&.account&.full_name, "/admin/sellers/#{object.account_id}"

        elsif object.account.role == "stylist"

          link_to object&.account&.full_name, "/admin/stylists/#{object.account_id}"

        elsif object.account.role == "driver"

          link_to object&.account&.full_name, "/admin/drivers/#{object.account_id}"  

        else

          object.account

        end

      end

      row :created_at

      row :updated_at

      row "Images" do

        ul do

          resource.images.each do |image|

            span(style: 'margin-right: 15px;') do

              image_tag(image, class: "catalogue-image", size: "100x100")

            end

          end

        end

      end

    end

  end

  controller do

    helper_method :subcategories_for_catalogue

    def subcategories_for_catalogue(catalogue)

      if catalogue.category.present?

        BxBlockCategories::Category.find(catalogue.category_id).sub_categories.pluck(:name, :id)

      else

        [] # Return an empty array if no category is selected yet

      end

    end

    def update

      @catalogue = BxBlockCatalogue::Catalogue.find(params[:id])

      if @catalogue.update(permitted_params[:catalogue])

        catalogue_images(@catalogue, params)

      else

        render :edit

      end

    end

    def catalogue_images(catalogue, params)

      @catalogue = catalogue

      if params[:catalogue][:remove_images].present?

        params[:catalogue][:remove_images].reject(&:empty?).each do |image_id|

          @catalogue.images.find(image_id).purge

        end

      end

      @catalogue.images.attach(params[:catalogue][:images]) if params[:catalogue][:images]

      # Remove selected images for catalogue variants

      if params[:catalogue][:catalogue_variants_attributes]

        params[:catalogue][:catalogue_variants_attributes].each do |_, variant_attributes|

          cat_exist_image(@catalogue, variant_attributes)

        end

      end

      # Attach new images for catalogue variants

      if params[:catalogue][:catalogue_variants_attributes]

        params[:catalogue][:catalogue_variants_attributes].each do |_, variant_attributes|

          catalogue_variants_exist_image(@catalogue, variant_attributes)

        end

      end

      redirect_to admin_catalogue_path(@catalogue), notice: "Catalogue updated successfully."

    end

    def cat_exist_image(catalogue, variant_attributes)

      if variant_attributes[:remove_variant_images].present?

        variant_attributes[:remove_variant_images].reject(&:empty?).each do |image_id|

          catalogue.catalogue_variants.find(variant_attributes[:id]).images.find(image_id).purge

        end

      end

    end

    def catalogue_variants_exist_image(catalogue, variant_attributes)

      if variant_attributes[:images].present?

        check_catalogue_variant_new_record(catalogue, variant_attributes)

      end

    end

    def check_catalogue_variant_new_record(catalogue, variant_attributes)

      if variant_attributes[:id].present?

        variant_id = variant_attributes[:id].to_i

        catalogue.catalogue_variants.find(variant_id).images.attach(variant_attributes[:images])

      else

        new_variant = catalogue.catalogue_variants.create("catalogue_variant_color_id"=>variant_attributes[:catalogue_variant_color_id], "catalogue_variant_size_id"=>variant_attributes[:catalogue_variant_size_id], "price"=>variant_attributes[:price], "stock_qty"=>variant_attributes[:price], "length"=>variant_attributes[:length], "breadth"=>variant_attributes[:breadth], "height"=>variant_attributes[:height], "block_qty"=>variant_attributes[:block_qty], "sku"=>variant_attributes[:sku],)

        new_variant.images.attach(variant_attributes[:images])

      end

    end

  end

  form do |f|

    f.inputs "Catalogue Details" do

      f.input :name

      f.input :description

      f.input :category_id, as: :searchable_select, collection: BxBlockCategories::Category.all.collect {|var| [var.name, var.id] }, include_blank: false

      # f.input :sub_category_id, as: :searchable_select, collection: BxBlockCategories::SubCategory.all.collect {|var| [var.name, var.id] }, include_blank: false

      # f.input :sub_category_id, as: :searchable_select, collection: []

      f.input :sub_category_id, as: :searchable_select, collection: subcategories_for_catalogue(f.object), include_blank: false

      f.input :sku

      f.input :manufacture_date, as: :date_picker, input_html: { max: Date.current.strftime("%Y-%m-%d") }

      f.input :availability

      f.input :stock_qty

      f.input :account_id, as: :searchable_select, collection: AccountBlock::Account.all.collect {|var| [var.full_name, var.id] }, include_blank: false

      f.input :product_number

      if f.object.images.present?

        f.input :remove_images, as: :check_boxes, collection: f.object.images.map { |image| [image_tag(image, class: 'checkbox-image', style: 'width:50px;height:50px;'), image.id] }, input_html: { class: "custom-checkbox-label" }

      end  

      f.input :images, as: :file, input_html: { multiple: true }, label: "Add New Images"

    end

    f.has_many :catalogue_variants, heading: 'Catalogue Variants', allow_destroy: true, new_record: 'Add Variant' do |variant_form|

      variant_form.input :catalogue_variant_color_id, as: :searchable_select, collection: BxBlockCatalogue::CatalogueVariantColor.all.collect {|var| [var.name, var.id] }, include_blank: false

      variant_form.input :catalogue_variant_size_id, as: :searchable_select, collection: BxBlockCatalogue::CatalogueVariantSize.all.collect {|var| [var.name, var.id] }, include_blank: false

      variant_form.input :price

      variant_form.input :stock_qty

      variant_form.input :length

      variant_form.input :breadth

      variant_form.input :height

      variant_form.input :block_qty

      variant_form.input :sku

      # hint = variant_form.object.images.map do |image|

      #   image_tag(image, style: 'width: 100px; height: 100px;')

      # end.join('<br>').html_safe

      if variant_form.object.images.present?

        variant_form.input :remove_variant_images, as: :check_boxes, collection: variant_form.object.images.map { |image| [image_tag(image, class: 'checkbox-image', style: 'width:50px;height:50px;'), image.id] }, input_html: { class: 'custom-checkbox-label' }

      end  

      variant_form.input :images, as: :file, input_html: { multiple: true }, label: "Add Variant Images"

      # variant_form.input :images, as: :file, input_html: { multiple: true}, :hint => hint

    end

    f.actions

  end

end

Tuesday, 16 January 2024

How to add jquery and bootstrap in rails 7

 1. Add gem: 

gem 'jquery-rails'

gem 'jquery-ui-rails'

gem "bootstrap"

gem "sassc-rails"

Run: bundle install

-----------------------------------------------------------

2. config/initializers/assets.rb

Rails.application.config.assets.precompile += %w( jquery.min.js jquery_ujs.js bootstrap.min.js )

--------------------------------------------------------------------------------------------------------------

3. config/importmap.rb

pin "jquery", to: "jquery.min.js", preload: true
pin "jquery_ujs", to: "jquery_ujs.js", preload: true
pin "bootstrap", to: "bootstrap.min.js", preload: true

---------------------------------------------------------------------------------

4. app/assets/stylesheets/application.scss

@import "bootstrap";

-------------------------------------------------------------------
5. /app/javascript/application.js

import "jquery"
import "jquery_ujs"
import "bootstrap"

Then restart server: rails server


Form tag and auto submit form after 1 sec.

<div class="container-fluid">
  <div class="row mt-4">
    <div class="col-md-6">
    <%= form_tag "/fetch_breed", class: "inline-form", id: "breed_form", remote: true do %>
        <label for="breed">Breed:</label>
        <input type="text" id="bname" name="breed" class="form-control" value="affenpinscher">
        <button type="submit" class="btn btn-success">Submit</button>
      <% end %>
    </div>
    <div class="col-md-6">
      <div class="show_breed"></div>
    </div>
  </div>
</div>

<script type="text/javascript">
setTimeout(() => {
  $("#breed_form").submit();
}, "1000");
</script>


Wednesday, 10 January 2024

How to run react native application step by step without emulator

Note: Your mobile must have developer options is ON

Please visit one https://www.youtube.com/watch?v=r33OwlTnTE4

 Step 1. Make sure your system install or not android studio

Install Android studio: https://www.geeksforgeeks.org/how-to-install-android-studio-on-ubuntu/


Run this $ echo $ANDROID_HOME

getting this results: /home/zzzz/Android/Sdk

----------------------------------------------------------------

Step 2. Create new application

     npx react-native@latest init ProjectName

-----------------------------------------------------------------

Step 3. Please connect your mobile with USB cable

Choose  this line : File tranfer/Android Auto

-------------------------------------------------------------

Run on Phisical device

Visite this site: https://github.com/arvindkushwah9/React-Native-Example

Step 4. projects$   lsusb

        Make sure your device is connected or not

Getting lists of all devices result:

Bus 002 Device 001: ID aaaaaa:aaaaaa Linux Foundation 3.0 root hub

Bus 001 Device 005: ID bbbbb:bbbbbb Chicony Electronics Co., Ltd Integrated Camera

Bus 001 Device 004: ID ccccc:eeeee Intel Corp. 

Bus 001 Device 003: ID vvvvv:ddddd Dell Computer Corp. Dell MS116 USB Optical Mouse

Bus 001 Device 006: ID XXXX:ffff Xiaomi Inc. Mi/Redmi series (MTP + ADB)

Bus 001 Device 001: ID bbbb:bbbbb Linux Foundation 2.0 root hub

My device ID is Xiaomi and device id XXXX 

--------------------------------------------------------------

Step 5. run this line in the project directry

echo 'SUBSYSTEM=="usb", ATTR{idVendor}=="XXXX", MODE="0666", GROUP="plugdev"' | sudo tee /etc/udev/rules.d/51-android-usb.rules

-----------------------------------------------------------------------

Step 6. Run: npx react-native run-android

Install via USB is ON << under the Developer options

---------------------------------------------------------------------

Step 7. Run: npx react-native start