Skip to main content

Bootstrap with Bootswatch

I think I have to employ Bootstrap for the UI. I'm spinning my wheels trying to pick compatible colors--that's just a waste of time. I came across Bootswatch, which has a bunch of Bootstrap templates.

I like this one: https://bootswatch.com/cerulean/


This should be easy: https://bootstrap-vue.js.org/

First: npm install vue bootstrap-vue bootstrap

 Then: 
// app.js
import Vue from 'vue'
import BootstrapVue from 'bootstrap-vue'

Vue.use(BootstrapVue)
This is what Vue plugins look like (fontawesome does the same thing):
// This imports all the layout components such as <b-container>, <b-row>, <b-col>:
import { LayoutPlugin } from 'bootstrap-vue'
Vue.use(LayoutPlugin)


Comments

Post a Comment

Popular posts from this blog

GraphQL is the many-to-many solution

Exactly! Regular readers of this blog (me) will appreciate my stumbling attempts to pre-define a REST interface that supports many-to-many interfaces. GET a class, for example, and the return includes an array of the students in that class. In this context, we don't want a full Student record, just the Student's name and Id, for example. With a REST interface, the server writer has to guess how to abbreviate the Student record. GraphQL fixes that. The front end requests just the data it wants. If we want a list of the students in a class and the assigned roommates for that student...we can do that! A lot of my prototype REST service is hardwired--not single tables, so much, but the many-to-many stuff certainly. There was a certain amount of work implementing the simple router ("/table/recordno"). GraphQL means throwing a lot of that away, but I can see immediately that GraphQL's approach is what I want. My schema tables (implementing INSERT and UPDATE) look ...
Post a Comment
Read more

JSON/MySQL Schemas

As noted previously, there is a lot of overlap between the RDBMS world and the JSON world. Identifiers JSON is defined to allow identifiers of any kind of Unicode string, encoded in UTF-8 (or UTF-16, etc.). They begin and end with double quotation marks (U+0022), so included quotation marks and '\' must be escaped as \" or \\. Control characters (ASCII 0-x1F) must be escaped as well. In practice, JSON identifiers conform to ECMAScript standards . There are some 68  reserved keywords (function, import, for, if, else, and so on) that should not be used as identifiers. Unexpected reserved words include abstract, await, debugger, delete, finally, instanceof, super, synchronized, transient, volatile, and yield. The spec makes a distinction between identifiers and IdentifierNames (specifically, array keys), but why risk it? ECMAScript allows '$' and '_' anywhere in an identifier. Length or camelCasing are not part of the spec. As for length, there seems t...
Post a Comment
Read more

Vue.js

I had the example from a YouTube Tutorial on Vue working, but I'm having a little trouble creating an empty project for my own development. Part of the issue is that Vue is compiled. What you're running is minified (or not) JavaScript that includes a ton of stuff along with your app. So you can write a little, compile it, look at it in a browser (using the WAMP server) and repeat those steps to death, or you can use their system development which automatically compiles and auto-runs when it notices a source code change. vue ui brings up an app (at /localhost:8000) that manages this process, in theory, but I've forgotten the mechanics of it. In the example, we had a tree: public `--src      `--App.vue      `--views      |    `--Home.vue      |    `--About.vue      `--components           `--Todos.vue           `--TodoItem.vue ...
Post a Comment
Read more