Skip to main content

Posts

Dynamically altering CSS Style Sheets in JS

 I recently had a project which was running unit tests in an ajax call and color coding a corresponding row in a table according to the results. The calls were being made, the tests were being run, the results returned and the correct <div> being identified to change the background color. The problem: a CSS class in Bootstrap had such a particular specificity that it was overriding an effort I made to change the background color of the table row using classes.  After searching how to dynamically alter a CSS style sheet I came upon this solution.  The document.styleSheets property is a collection of the style sheets attached to the page. I needed to loop over them, identify the one I wanted to access since they can appear in any order, and then delete the rule I wanted (it wasn't being used anywhere. If it was, this would be much more complicated). Also since, it wasn't a true array, the each() method wasn't available. Throw back to a for loop. for(var x=0; x<docume
Recent posts

CF: Scripting amidst the tags

Recently I had to do a quick "utility" page where I needed to see how many files from a directory listing had been recorded into a database. I've been writing about 98% of my CF code in script syntax but, since it was quick and easy, I did this quickly in tags because it was outputting directly to the browser. In doing so, I made an interesting discovery in that, when you use closures, even in tag based pages, you can write cfscript. Here's the example Get the directory listing:  < cfset alljs = directoryList(expandpath( '/src' ), true , "path" , "*.js" )> Get the database listings and convert it to an array < cfquery name = "alljsQ" datasource = "blah" > select * from sitefiles where filename like '%.js%' </ cfquery > < cfset recordedFiles = valuelist(alljsQ.filename).listToArray()> Use a filter function to weed out the files I'd already recorded < cfset missingFiles = alljs.fi

More on Site Architecture / CI/CD / and Repos

We're starting to move from the high level overview and more into the details of our project.  Architecture We established that we using React as our front end technology and ColdFusion as our server side. At a more granular level, we'll be using React with Redux for our front end app and we want our server side to be not just "ajax" enabled but a true REST API. To this end, we're going to incorporate Coldbox from Ortus Solutions. Repos These two code bases have different needs, and possibly locations, when they are deployed. As a result, we're going to have two repositories: one for the React and another for the API. This will allow us to keep our code separated and cleaner all the way through to deployment.  For each of these repos, we'll follow the procedure we laid out previously with the MASTER branch being used to deploy to production and a DEVELOPMENT branch being used for active work which is then fed into the Master branch via pull requests.  Test

As the Dev Ops Coordinator, I need to set up our git repo into several branches with the appropriate permissions for each one

Part of the CI/CD Development Series The core of every CI/CD process is the code repository whether it be Git, Mercurial, SVN or whatever. The general idea is that it allows multiple developers (or whomever) to access your code in the appropriate way in the appropriate level. This can either be the ability for anyone to pull an open source project but not write to the repo directly or full access to a developer on your team to create branches, push to master or anything that needs doing. For our project, we're using git although the hosting provider was up for discussion between Github, Bitbucket by Atlassian or CodeCommit on AWS. We decided to go with AWS for two reasons. 1. We are going use other tools in AWS as part of the build so we decided to keep it all together. 2. We needed to solidify the ins and outs of using IAM for the process. Basic Steps Create the Repo Create the branches we need Use IAM to apply the appropriate permissions to each branch and to set up

As the Dev Ops Manager, I need to start planning our CI/CD release process

Part of the CI/CD Development Series Once we have our Deployment Diagram designed, we need to figure out out to get from here to there. If the end point is the appropriate server environment, the starting point is the developer with his/her hand on the keyboard. These steps take place on a variety of machines, within various process and can changes based on what files are checked in or not. At the moment, we've only created the early basics as seen below. The Beginning of our Deployment Activity Chart Even though there is quite a long way to go there are some elements which we have already been determined. For example We have determined the broad strokes of our technology stack. This is going to be React on the front end and ColdFusion on the server side. We have determined that we are going to be using linting on both the CF and React paths. CFLint for the CF and ESLint for the Javascript We have determined that we are going to be formatters - CFFormat for CF and

The Three Deployment Environments: Production, Testing, Development

Part of the CI/CD Development Series A UML Deployment Diagram is a static picture that shows the different "nodes" that work together to create an environment. Typically these nodes consist of hardware, software or other key points. It's a high level overview, just enough detail to get the idea across of the layout without getting too lost in the details. These are the three deployment diagrams for our project. Production The production deployment is more elaborate than the other two below. Our project has a React front end which means that in addition to images and CSS files, it will also have a largish number of Javascript files. All of these are static and do not need any server side processing. As a result, we don't want them on our ColdFusion server taking up space, memory, bandwidth and other resources when we can use those resources for more efficient processing of ColdFusion files. This allows our server to handle more CF requests since they are not busy

As a Dev Ops Coordinator I would like a tool which allows central creation of diagrams which "live update" in several places.

Part of the CI/CD Development Series In order to achieve your goal, you need to a) have one and then b) find the best way to clarify that goal into some tangible medium. Paper and doodling is a great start but eventually those doodles need to be put into a some clear communication format which is accessible to yourself, your team and anyone else who needs to see what you are striving for. There are several diagrams that go into communicating the plans and specifics of software projects. UML has several diagram listings including Deployment Diagrams, such as the one below, Component Diagrams, Activity Diagrams and more. This inevitably leads to the multiple problems of  - How to develop the diagrams  - How to publish the diagrams in locations which can be referenced by the target audience  - How to update the diagrams which have been distributed or published. This last item is probably the most difficult since it is easy to put off publishing the new diagrams until it is &quo