Discover all the tech
Issue #654
A good landing page is one of the most crucial part of a successful launch. Recently I started creating landing pages for my apps, I was lazy that I ended creating a white label React app as a landing template and then write a script to …
Issue #653
Use https://github.com/biati-digital/glightbox
Configure css. Specify class='glightbox for html elements
<link rel="stylesheet" href="css/blueimp-gallery.min.css" />
Install package
npm install glightbox
import …Issue #652
Use https://github.com/michalsnik/aos
Add link to head
<head>
<link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
</head>
Jus before closing body tag
<script src= …Issue #651
Use shelljs
npm install shelljs
const shell = require('shelljs')
shell.exec(`cp -a source_path/. destination_path`)
The -a option is an improved recursive option, that preserve all file attributes, and also preserve symlinks.
The …
Issue #650
Install
npm install @babel/core
npm install @babel/cli
npm install @babel/preset-env
Configure .babelrc
{
"presets": ["@babel/preset-env"]
}
In package.json, transpile using npx babel then node dist/index.js …
Issue #649
Check flag then define css
const Picture = (feature) => {
const shadowCss = feature.shadow ? css`
border-radius: 5px;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
` : css`` …Issue #648
In a similar fashion to plain old javascript, note that href needs to have valid hash tag, like #features
<a
href='#features'
onClick={() => {
const options = {
behavior: 'smooth'
} …Issue #647
emotion can be used in framework agnostic or with React. To use with React, follow https://emotion.sh/docs/introduction#react
npm i @emotion/core
Note that you must have /** @jsx jsx */ at the top of the file, and the unused jsx in import …
Issue #646
Pass DispatchQueue and call queue.sync to sync all async works before asserting
Use DispatchQueueType and in mock, call the work immediately
import Foundation
public protocol DispatchQueueType {
func …Issue #645
npm init
npm install webpack webpack-cli --save-dev
vim webpack.config.js
module.exports = {
entry: "./index.js",
mode: 'production',
output: {
filename: "./index.js"
}
}
To …
Issue #644
import XCTest
extension XCTestCase {
/// Asynchronously assertion
func XCTAssertWait(
timeout: TimeInterval = 1,
_ expression: @escaping () -> Void,
_: String = "",
file _: StaticString = …Issue #643
Use material icons
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
div#filter-container {
display: flex;
align-items: center;
justify-content: center;
margin-top: …Issue #642
Specify container with flex-wrap and justify-content, and item with float: left
div.cards {
display: flex;
justify-content: center;
flex-direction: row;
flex-wrap: wrap;
margin-top: 10%;
}
div.card {
overflow: hidden;
float: …Issue #641
Create a new page
hexo new page mydemo
Remove index.md and create index.html, you can reference external css and js in this index.html. Hexo has hexo new page mydemo --slug but it does not support page hierarchy
Specify no layout so it is …
Issue #640
async function useCache(
collectionName: string,
key: string,
response: functions.Response<any>,
fetch: () => Promise<any>
): Promise<any> {
const existing = await db.collection(collectionName). …Issue #639
Never use String(format: "%.2f %%", 1.2 because each region can have different separator and placement of percent sign.
Use NumberFormatter instead
let formatter = NumberFormatter()
formatter.numberStyle = .percent
formatter. …Issue #638
Use commandDefinitions in XCSourceEditorExtension.
import Foundation
import XcodeKit
class SourceEditorExtension: NSObject, XCSourceEditorExtension {
func extensionDidFinishLaunching() {
}
var commandDefinitions: [[ …Issue #638
Use commandDefinitions in XCSourceEditorExtension.
import Foundation
import XcodeKit
class SourceEditorExtension: NSObject, XCSourceEditorExtension {
func extensionDidFinishLaunching() {
}
var commandDefinitions: [[ …Issue #636
Normally we can just wrap NSTextField
struct SearchTextField: NSViewRepresentable {
@Binding var text: String
var hint: String
var onCommit: (String) -> Void
func makeNSView(context: NSViewRepresentableContext< …Issue #635
textField.delegate = self
NSTextFieldDelegate
func control(_ control: NSControl, textView: NSTextView, doCommandBy commandSelector: Selector) -> Bool {
if (commandSelector == #selector(NSResponder.insertNewline(_:))) {
// …I’m a thinker and storyteller with a passion for exploring the intersection of creativity and technology
🧑💻 I love crafting high quality and useful apps
🔥 I love open source. My GitHub open source has 2.3k followers with packages that are integrated by 45k+ apps and over 3.4m+ downloads on CocoaPods.
✍️ I write here on my blog and on Medium, which has over 2.7k+ followers with tons of articles and 90k+ monthly views.
🖥 Follow me for sharings about Swift, SwiftUI, iOS and macOS development.