Jason jschee

## gist:c81aea565bcc1b75a92823b99cec7a7d

      
              1 file
            
          
              0 forks
            
          
              0 comments
            
          
              0 stars
            
          
                jschee
                / gist:c81aea565bcc1b75a92823b99cec7a7d
            
            
              Last active
              March 12, 2024 20:22
            
              
                How to add Vue.js in your Ruby on Rails project with importmaps
              
          
    Step 1 - Pin vue to your project

pin "vue", to: "https://ga.jspm.io/npm:vue@3.2.26/dist/vue.esm-browser.js", preload: true
Step 2 - Initialize Vue app

create app/javascript/vue.js
import * as Vue from "vue"

  
## clear_queue.rb
## i stash this in rails root folder and run it when i need to clear my sidekiq queues in development.

require 'sidekiq/api'

Sidekiq::Queue.all.each(&:clear)
Sidekiq::RetrySet.new.clear
Sidekiq::ScheduledSet.new.clear
Sidekiq::DeadSet.new.clear

## walmart.rb
require "watir"

browser = Watir::Browser.new(:chrome, switches: ['--incognito'])
sleep 2
browser.goto("https://www.walmart.com/ip/PlayStation-5-Console/363472942") ## or https://www.walmart.com/ip/Sony-PlayStation-5-Digital-Edition/493824815
sleep 4
browser.button(class: ["button", "spin-button", "prod-ProductCTA--primary", "button--primary"]).click
sleep 4
browser.button(class: ["button", "ios-primary-btn-touch-fix", "hide-content-max-m", "checkoutBtn button--primary"]).click
sleep 4

## css code snippet sparkle cms
Oh Hello Sparkle CMS...

Here's something I'm somewhat proud of.
A few years back I decided to not use a ui framework to build my website(although I do enjoy using tailwindcss, tachyons, and bootstrap).
This gave me the opportunity to learn about sass, css resetting, and how to properly use mixins...
To see some of this css in action check out this page I created just for you SparkleCMS.
https://jasonchee.me/sparklecms/hello


_mixins.scss

## prawn fixed header & footer combination with padded box helper
##### hey jason just want to remind you how to execute the script. rails runner 'lib/filename.rb'

require 'prawn'
require_relative './prawn_helpers/padded_box_helper'
filepath = './pdf_page_12.pdf'

class Prawn::Document
  include PaddedBoxHelper
end

## rails new project
rails new \
-d postgresql \
--skip-keeps \
--skip-test \
--skip-bundle \
--skip-javascript \
-S \
-C \
-m https://raw.githubusercontent.com/jschee/temp_asset/master/asset/eightyeight_template.rb \
APP_NAME

## Turbolinks meta head tag
#In application layouts
<head>
  <% if content_for(:turbolinks_cache) %>
    <%= yield(:head) %>
  <% end %>
</head>


#On view page

## active_storage tutorial aliyun as example
#step_1 create migration

#rails active_storage:install
#rails db:migrate


#step_2 add adapter gem of bucket provider

# e.g. gem 'activestorage/aliyun'
# bundle install

## wx audio playback boilerplate.
// Data variables
responses: [
  {
    id: '',
    playUrl: '',
    duration: 100,
    likes: 0,
    avatar: '',
    username: '',
    title: ''

## mixins example
// Typography ———————————————————————————————— •
$font-serif: 'Marriweather', Georgia, serif;
$font-sans: "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", sans-serif;

@mixin font-smoothing($attr) {
  -webkit-font-smoothing: $attr;
          font-smoothing: $attr;
}

// Colors ———————————————————————————————————— •
	## i stash this in rails root folder and run it when i need to clear my sidekiq queues in development.

	require 'sidekiq/api'

	Sidekiq::Queue.all.each(&:clear)
	Sidekiq::RetrySet.new.clear
	Sidekiq::ScheduledSet.new.clear
	Sidekiq::DeadSet.new.clear
	require "watir"

	browser = Watir::Browser.new(:chrome, switches: ['--incognito'])
	sleep 2
	browser.goto("https://www.walmart.com/ip/PlayStation-5-Console/363472942") ## or https://www.walmart.com/ip/Sony-PlayStation-5-Digital-Edition/493824815
	sleep 4
	browser.button(class: ["button", "spin-button", "prod-ProductCTA--primary", "button--primary"]).click
	sleep 4
	browser.button(class: ["button", "ios-primary-btn-touch-fix", "hide-content-max-m", "checkoutBtn button--primary"]).click
	sleep 4
	Oh Hello Sparkle CMS...

	Here's something I'm somewhat proud of.
	A few years back I decided to not use a ui framework to build my website(although I do enjoy using tailwindcss, tachyons, and bootstrap).
	This gave me the opportunity to learn about sass, css resetting, and how to properly use mixins...
	To see some of this css in action check out this page I created just for you SparkleCMS.
	https://jasonchee.me/sparklecms/hello


	_mixins.scss
	rails new \
	-d postgresql \
	--skip-keeps \
	--skip-test \
	--skip-bundle \
	--skip-javascript \
	-S \
	-C \
	-m https://raw.githubusercontent.com/jschee/temp_asset/master/asset/eightyeight_template.rb \
	APP_NAME
	#In application layouts
	<head>
	<% if content_for(:turbolinks_cache) %>
	<%= yield(:head) %>
	<% end %>
	</head>


	#On view page
	#step_1 create migration

	#rails active_storage:install
	#rails db:migrate


	#step_2 add adapter gem of bucket provider

	# e.g. gem 'activestorage/aliyun'
	# bundle install
	// Data variables
	responses: [
	{
	id: '',
	playUrl: '',
	duration: 100,
	likes: 0,
	avatar: '',
	username: '',
	title: ''
	// Typography ———————————————————————————————— •
	$font-serif: 'Marriweather', Georgia, serif;
	$font-sans: "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", sans-serif;

	@mixin font-smoothing($attr) {
	-webkit-font-smoothing: $attr;
	font-smoothing: $attr;
	}

	// Colors ———————————————————————————————————— •